[Design]-> Decalage

Sujet résolu

29 mars 2006 à 18:47:36

Salut tout le monde !

Je viens de voir que le design de mon site plantait avec Internet Explorer 6.0

Le problème survient au niveau du corps de la page : il ne s'aligne pas avec le menu.

Le site est disponible ici et la feuille de style ici.

A titre de comparaison le site fonctionnait parfaitement avec avec cette feuille de style css avant, depuis il n'y a eu aucun changement au niveau du codage xhtml.

Merci d'avance !

@bientôt

Deeder

29 mars 2006 à 20:28:41

Pour rester poli, je dirais : quel gros bordel dans ce code... :-°

Essaye de rajouter un display: inline à tes class .menus et .style_tab_news. Mais je ne te promets rien dans ce foutoir...

Au fait, l'image de l'écureil de Ice Age n'est pas libre de droits mais je suppose que tu as toutes les autorisations necessaires pour l'exploiter...

wow360

29 mars 2006 à 20:37:43

Moi, si ca ne te dérange pas, j'aurais quelques questions à te poser :

-Comment fait tu pour mettre une barre horizontale qui sépare chaque nouveaux message ?
-Et comment fait tu pour que le "corps" soit extensible ? Car apparement ces une image donc...

merci de répondre à mes questions !!!

nico572

29 mars 2006 à 22:44:14

j'ai le meme probleme
ici
mon css

body
{
width: 760px;

margin-top: 20px;
margin-bottom: 20px;
background-image: url("images/fma.jpg");
}

#en_tete
{
width: 850px;
height: 70px;
background-image: url("images/fondmenu.jpg");
background-repeat: no-repeat;
margin-bottom: 10px;
border: 5px ridge black;
margin-left: 70px;
}

#menu
{
margin-top: 30px;
float: left;
width: 140px;
}

.element_menu
{
background-image: url("images/fondmenu.jpg");
background-repeat: repeat-x;

border: 5px ridge black;

margin-bottom: 20px;
}

.element_menu h3
{
text-align:center;
}

.element_menu a:hover
{
background-color: blue;
color: yellow;
font-style: italic;
}

#corps
{
margin-left: 250px;
padding: 5px;
margin-top: 200px;
color: blue;
background-image: url("images/fondmenu.jpg");
border: 5px ridge black;
width: 600px ;
font-family: papyrus, "Times New Roman", Times, serif;
background-color: white;

}

#corps h1
{

text-align: center;
font-family: papyrus, "Times New Roman", Times, serif;
}

#navigation
{
margin-top: 50px;
margin-left: 295px;
}

#navigation a
{
display: block ;
width: 100px ;
color: blue ;
background-image: url("images/fondmenu.jpg");
text-align: center ;
padding: 4px;
text-decoration: none ;
float: left ;
border: 4px ridge black;
margin-top:10px;
background-color: white;
}

#navigation a:hover
{
color: yellow;
background: blue;
font-style: italic;
}

merci pour vos reponse

pascall

30 mars 2006 à 0:22:06

pour Nico voilà ce que j'ai fait
un margin auto à body
un float:rigth au corps, redimensionné le corps ...

ta banniere est trop longue 850 pour un body de 760 :-°

je l'ai réduite à 750px

voilà le code css

body

{

width: 760px;

margin:auto;

margin-top: 20px;

margin-bottom: 20px;

background-image: url("images/fma.jpg");

}

#en_tete

{

width: 750px;

height: 70px;

background-image: url("images/fondmenu.jpg");

background-repeat: no-repeat;

margin-bottom: 10px;

border: 5px ridge black;

margin:auto;

}

#menu

{

margin-top: 30px;

float: left;

width: 140px;

}

.element_menu

{

background-image: url("images/fondmenu.jpg");

background-repeat: repeat-x;

border: 5px ridge black;

margin-bottom: 20px;

}

.element_menu h3

{

text-align:center;

}

.element_menu a:hover

{

background-color: blue;

color: yellow;

font-style: italic;

}

#corps

{

float:right;

padding: 5px;

margin-top: 60px;

color: blue;

background-image: url("images/fondmenu.jpg");

border: 5px ridge black;

width: 480px ;

font-family: papyrus, "Times New Roman", Times, serif;

background-color: white;

}

#corps h1

{

text-align: center;

font-family: papyrus, "Times New Roman", Times, serif;

}

#navigation

{

margin-top: 50px;

margin-left: 265px;

}

#navigation a

{

display: block ;

width: 100px ;

color: blue ;

background-image: url("images/fondmenu.jpg");

text-align: center ;

padding: 4px;

text-decoration: none ;

float: left ;

border: 4px ridge black;

margin-top:10px;

background-color: white;

}

#navigation a:hover

{

color: yellow;

background: blue;

font-style: italic;

}

j'espere que ca ira

nico572

30 mars 2006 à 19:48:59

a sa marche

merci pascall

madyn

30 mars 2006 à 20:09:30

Le css est celui-là donc pas besoin de dire que c'est un foutoir car c'est quand même rangé !

Ensuite pourquoi mettre un block en inline alors qu'il contient des blocks ?

Donc mon problème n'est toujours pas réglé...

Merci d'avance

@bientôt

madyn

31 mars 2006 à 19:28:49

Quelqu'un a une petite idée ?

Merci d'avance

madyn

1 avril 2006 à 14:37:54

Personne ne connaitrait une solution ?

Merci d'avance

Deeder

1 avril 2006 à 15:12:29

Citation : madyn

Le css est celui-là donc pas besoin de dire que c'est un foutoir car c'est quand même rangé !

Ensuite pourquoi mettre un block en inline alors qu'il contient des blocks ?

Donc mon problème n'est toujours pas réglé...

Merci d'avance

@bientôt

Je ne parlais pas des CSS mais du xhtml...

Le inline est en fait une astuce pour palier à ce bug présent sur IE. Il permet de mettre côté à côte les deux éléments sans qu'ils ne se décalent our ne se mettent l'un en dessous de l'autre...

madyn

1 avril 2006 à 15:32:39

Ca change rien o_O

Merci d'avance

P.S : Je l'ai testé en localhost

Deeder

1 avril 2006 à 15:37:15

Qu'as-tu appliqué à ta class exactement et que veux-tu comme rendu final ?

En fait, il faut remettre les valeurs que tu souhaite, même si ce sont les apparences par défaut de la balise. Il faut la définir pour qu'elles ne soient pas assimilées à celles précédemment définies...

madyn

1 avril 2006 à 22:56:48

J'ai pas compris ton explication

Bah j'ai fais comme t'as dis, j'ai mis "display: inline;" aux class .menus et .style_tab_news mais rien ne change :/

Merci d'avance

madyn

2 avril 2006 à 11:06:24

Quelqu'un a une petite idée ?

Merci d'avance

@bientôt

madyn

3 avril 2006 à 17:20:14

Une petite idée ?

Merci d'avance

@bientôt

Riko

3 avril 2006 à 18:09:33

Salut,
essaies de supprimer

<div id="style_tab_general"> et la balise de fermeture également.
Tu supprimes le css correspondant.

En fait tu sort tout le contenu de "style_tab_general", donc code html débutera par:
1-la div "image_header">
2-la div "menus">
3-la div "style_tab_menu">
ect...

madyn

3 avril 2006 à 19:10:36

Merci, le problème est réglé !

[Design]-> Decalage

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.

× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.

[Design]-> Decalage

[Design]-> Decalage

Supprimer

Modérer

Signaler le message aux modérateurs