28173 sujets

CSS et mise en forme, CSS3

Position Absolute div qui disparait sur IE & OPERA

Coucou,

J'ai mis une image tout en haut à gauche sur mon site.
Sauf que sur IE & OPERA, mon code ne se voit pas malheuresement ...

Je l'avais aussi mise sans position, en la réglant avec un margin-left & margin-top, mais IE/OPERA ne l'adapte pas pareil.

Mais si je la met en position-absolute, l'image disparaît sur les autres navigateurs.

CSS


/* Feuille de style du site de ***
*******************************************************************************/

body

{
font-family:"Trebushet MS",Verdana,Geneva,Arial,Helvetica,sans-serif;
font-size:70%;
color: #422D1C;
margin: 0px;
background-color: #a0daf5;
background-image: url(../pics/design/pattern_all.png);
background-repeat: repeat; 
background-attachment: fixed;
border-left:3px  solid  #7F6C57;
border-right:3px  solid  #7F6C57;
height:100%;
}

html 
{
border-left:15px  solid  #422D1C;
border-right:15px  solid  #422D1C;
height:100%;
}

/* Mise en page
*******************************************************************************/

#container 
{
width:80%;
margin:0 auto;
text-align:center;
max-width :850px;
}

#before_navbar { padding-top:5%;}

#content 
{
width:100%;
height: 100%;
margin:auto;
text-align:justify;
color: #422D1C;
background-color:#BFA383;
border-left:1px solid #7F6C57;
border-right:1px solid #7F6C57;
padding-left:5px;
padding-right:5px;
padding-top:5px;
padding-bottom:5px;
}


#content p:first-letter {font-weight:bold;font-size:115%}
#mail p, #mailing p, #postal p {margin-left:1%;text-align:center;margin-right:1%;}
#credits p {margin-left:37%}

/*
#bordernavright {
float:right;
background-image:url("../pics/design/border_nav_right.png");
height:18px;
width:33px;
background-repeat:no-repeat;

font-size:1px;
}
#borderleft {
float:left;
background-image:url("../pics/design/border_nav_left.png");
height:18px;
width:15px;
background-repeat:no-repeat;
font-size:1px;
}
*/


/* Menu & Pied de page
*******************************************************************************/

#footer, #navbar  
{
font-family:"Trebushet MS",Verdana,Geneva,Arial,Helvetica,sans-serif;
color: #422D1C;
background-color: #a0daf5;
width:100%;
height:1.4em;
margin:auto;
padding-left:5px;
padding-right:5px;
font-weight:700;
font-size: 110%;
letter-spacing:1px;
border:1px solid #7F6C57;
text-align:center;
}

#webfoot,#webfootright{
position:absolute;
width:99.5%;
background-color: #a0daf5;

font-family: Verdana;

font-size: 100%;
margin-bottom: 0px;
bottom: 0px;
border-top:1px solid #7F6C57;
text-align:center;
font-weight:bold;
}

#www {
top:2px;
padding:0px;
position:absolute;
left:-15px;
}


HTML

<body>

<div id="www">
<img src="../../pics/design/www.png" alt="*" />
</div> <!-- #www -->
	
<div id="container">


Je le met au dessus du container, car l'image se met sur les borders appliqué à HTML.

Merci d'avance
Modifié par Bleeps (27 Apr 2006 - 11:53)
Sujet clos
Aller à