Bonjour à tous,
j'ai un petit problème de rendu sous Opera. Grosso modo, j'ai créé un menu et plus bas, je lui insère deux images. Je m'exécute et je place la première. Puis je fais mes vérifications sous les différents navigateurs (FF3, Ie8, Safari, Chrome) et seul Opera me donne un rendu différent de ma page... L'image sort du bloc où se trouve le menu et j'ai franchement pas d'idées pour remédier au problème (car seul Opera me fait des siennes). Pour placer l'image, j'avais utilisé un margin-top avec une valeur en pixel alliés à un margin-left avec de nouveau une valeur en pixel.
Bref, je vous donne le code xHtml du menu plus la feuille de style qui lui est associé (un brin bordélique je le conçois) au cas où cela peut aider quelqu'un.
j'ai un petit problème de rendu sous Opera. Grosso modo, j'ai créé un menu et plus bas, je lui insère deux images. Je m'exécute et je place la première. Puis je fais mes vérifications sous les différents navigateurs (FF3, Ie8, Safari, Chrome) et seul Opera me donne un rendu différent de ma page... L'image sort du bloc où se trouve le menu et j'ai franchement pas d'idées pour remédier au problème (car seul Opera me fait des siennes). Pour placer l'image, j'avais utilisé un margin-top avec une valeur en pixel alliés à un margin-left avec de nouveau une valeur en pixel.
Bref, je vous donne le code xHtml du menu plus la feuille de style qui lui est associé (un brin bordélique je le conçois) au cas où cela peut aider quelqu'un.
<div id="contenu">
<div class="conteneur1">
<div class="bandeau"></div>
<div class="bonhomme_menu"></div>
<div class="separation"></div>
<ul class="menu">
<li class="menu_selection"><a href="#">Avancement</a></li>
<li class="menu_selection"><a href="#">Le Studio : Un projet</a></li>
<li class="menu_selection"><a href="#">A propos de moi</a></li>
<li class="menu_selection"><a href="#">Copyright</a></li>
<li class="menu_selection"><a href="#">F.A.Q.</a></li>
<li class="menu_selection"><a href="#">Si vous voulez m'aider</a></li>
<li>S'inscrire au Flux Rss :</li>
</ul>
<div class="flux_twitter"></div>
<div class="flux_rss"></div>
</div>
</div>
#contenu .conteneur1
{
background:url(images/fond-menu.png) repeat-x #282420;
width:190px;
height:690px;
border-top:#7b7875 1px solid;
margin-bottom:80px;
}
#contenu .conteneur1 ul.menu a
{
text-decoration:none;
color:#988e84;
}
#contenu .conteneur1 ul.menu a:hover
{
text-decoration:none;
}
#contenu .conteneur1 ul.menu
{
list-style-type:none;
list-style-position:outside;
margin-left:10px;
margin-top:120px;
}
#contenu .conteneur1 ul.menu li
{
font-family:Arial;
font-weight:bold;
line-height:59px;
font-size:small;
color:#988e84;
height:58px;
width:179px;
float:right;
margin-bottom:10px;
display:block;
}
#contenu .conteneur1 ul li.menu_selection:hover
{
background:url(images/menu-hover.png) no-repeat;
text-indent:18px;
}
.conteneur1 .bandeau
{
background:url(images/bandeau-menu.png) no-repeat;
left:79px;
top:193px;
height:114px;
width:118px;
position:absolute;
}
#contenu .conteneur1 .separation
{
height:0px;
width:150px;
border-top:1px solid #62584e;
border-bottom:1px solid #4a443c;
position:absolute;
left:20px;
top:310px;
}
#contenu .conteneur1 .bonhomme_menu
{
background:url(images/bonhomme-menu.png) no-repeat;
height:100px;
width:74px;
position:absolute;
left:30px;
top:205px;
}
.flux_twitter
{
background:url(images/flux-twitter.png) no-repeat;
height:48px;
width:40px;
margin-top:590px;
}