[css] padding sur une image et doctype

padding sur une image et doctype [css] - HTML/CSS - Programmation

Marsh Posté le 17-04-2006 à 17:00:36    

bonjour,
je voudrais mettre une bordure de 1px sur une image et laisser un espace blanc de 12px entre cette image et la bordure.
j'ai fais ceci :  

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head><title>border padding</title>
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. <style>
  6. .bordure_photo IMG {BORDER-RIGHT: #1B75B5 1px solid; PADDING-RIGHT: 12px; BORDER-TOP: #1B75B5 1px solid; PADDING-LEFT: 12px; PADDING-BOTTOM: 12px; BORDER-LEFT: #1B75B5 1px solid; PADDING-TOP: 12px; BORDER-BOTTOM: #1B75B5 1px solid;background-color:#ffffff;}
  7. </style>
  9. </head><body>
  10. <div class='bordure_photo'><img src="http://www.csdm.qc.ca/stejarc/dictionnaire/imagesdicopq/planete.jpg" border="0" cellspacing="0" cellpadding="0"></div>
  11. </body></html>


ca marche tre bien sous mozilla, mais sous IE ca ne marche pas !
pour que ca marche a la fois sous IE et moz il faut  que je mette en doctype

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">

mais le probleme, c'est que, si je mets ceci en doctype, j'ai plein d'autres choses qui ne marche pas dans ma page (gestion de la hauteur, ...).
comment faire?
merci de votre aide

Reply

Marsh Posté le 17-04-2006 à 17:00:36   

Reply

Marsh Posté le 17-04-2006 à 17:52:34    

Voici une solution qui semble marcher pour IE et Fx :
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>border padding</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>.bordure_photo {
 BORDER-RIGHT: #1B75B5 1px solid;
 PADDING-RIGHT: 12px;
 BORDER-TOP: #1B75B5 1px solid;
 PADDING-LEFT: 12px;
 PADDING-BOTTOM: 12px;
 BORDER-LEFT: #1B75B5 1px solid;
 PADDING-TOP: 12px;
 BORDER-BOTTOM: #1B75B5 1px solid;
 float:left;
 display: inline;
 background-color:#ffffff;}
 </style>
</head>
<body>
<div class='bordure_photo'>
<img src="planete.jpg" height=256 width=256>
</div>
</body>
</html>

 

 
 

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed