[css] menu

  • Auteur de la discussion Auteur de la discussion bolo
  • Date de début Date de début
G
Grantome
Guest
Bon, t'a essayé de virer le border ?

Non, parce que entre FF et IE, il y déjà un problème de bordure.
Fine pour l'un et grosse pour l'autre.

Tu lui mettrait une taille, se ne serait pas plus mal. Et suis sur que ça aiderait.

Et met plus de 783px de large pour voir si l'image remonte.

Moi, je pense que le pb vient d'une de ces deux chose.
 
WRInaute discret
Grantome a dit:
Bon, t'a essayé de virer le border ?

Non, parce que entre FF et IE, il y déjà un problème de bordure.
Fine pour l'un et grosse pour l'autre.

Tu lui mettrait une taille, se ne serait pas plus mal. Et suis sur que ça aiderait.

Et met plus de 783px de large pour voir si l'image remonte.

Moi, je pense que le pb vient d'une de ces deux chose.
Lorsque que j'enlève ca
Code:
	border-right : thin solid #000000;
	border-top : thin solid #000000;
	border-left : thin solid #000000;
	border-bottom : thin solid #000000;

l'image remonte , donc le problème vient de la ?!

comment faire ?
 
G
Grantome
Guest
Essai ça:

Code:
border: 1px solid #000000;

A la place des 4 autres


Edit pour virer "thin" :wink:
 
WRInaute discret
supprime le saut de ligne avant ta dtd, il y a un bug dans IE qui lui fait ignorer la DTD et passer en mode quirks s'il y a quoique ce soit avant
 
WRInaute discret
Grantome a dit:
Essai ça:
Code:
border: 1px solid #000000;
A la place des 4 autres
Edit pour virer "thin" :wink:

Ca ne change rien :(

supprime le saut de ligne avant ta dtd, il y a un bug dans IE qui lui fait ignorer la DTD et passer en mode quirks s'il y a quoique ce soit avant

a quel niveu je ne vois pas de saut de ligne
 
WRInaute discret
je ne comprends pas d'où elle sort cette ligne blanche pck voici le code de ma page
Code:
<%@ Page Language="C#" %>
<%@ import Namespace="System.Web.UI" %>
<%@ import Namespace="System.Web.UI.HtmlControls" %>
<%@ import Namespace="System.Web.UI.WebControls" %>
<%@ import Namespace="System.Drawing" %>
<%@ import Namespace="System.Web.Security" %>
<script runat="server">
Control Mapage;
    public void Page_Load(object sender, System.EventArgs e)
     {
     // charge les nouvelles
     Mapage = LoadControl("nouvelle.ascx");
     if(!IsPostBack){
      // charge la page
     PlaceHolder.Controls.Add(Mapage);
     }
     }
     // menu
      void Menu_Command(object sender, CommandEventArgs e)
          {
             string lien = e.CommandName;
            // vide le Control
             Mapage.Controls.Clear();
             // charge la nouvelle Page
             Mapage = LoadControl(lien);
             // charge dans la page
             PlaceHolder.Controls.Add(Mapage);
          }
      /* liens*/
      void Menu_click(object sender, CommandEventArgs e){
      string lien = e.CommandName;
            // vide le Control
             Mapage.Controls.Clear();
             // charge la nouvelle Page
             Mapage = LoadControl(lien);
             // charge dans la page
             PlaceHolder.Controls.Add(Mapage);
      }

</script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Cinéma Martinique - Madinina Film Les horaires et informations du cinéma en
    Martinique</title>
    <meta content="Madinina Film : L'actualité du cinéma en Martinique, les horaires , les commentaires des internautes,le tops, les photos..." name="description" />
    <meta content="film, cinéma, realisateur, acteur, actrice,sortie film, long metrage, court metrage, salle, seances, projection,site officiel,martinique,fort de france,antilles,dom,tom,dom-tom,madinina,madiana,Macromedia Central" name="keywords" />
    <link href="Css/principal.css" type="text/css" rel="stylesheet" />
</head>
<body>
    <form id="Form1" method="post" runat="server">
        <div class="top"><img alt="Madinina Film Actualité du Cinéma" src="images/MadininaFilm.jpg" /><a href="http://www.independza.com/MadininaMovie/"><img height="42" alt="Les nouvelles ..." src="images/MadininaFilm2_01.jpg" width="120" border="0" /></a><a href="admin/"><img height="42" alt="La Partie Admin" src="images/MadininaFilm2_02.jpg" width="196" border="0" /></a><a href="contact.aspx"><img height="42" alt="Contactez Nous !" src="images/MadininaFilm2_03.jpg" width="126" border="0" /></a><img height="42" src="images/MadininaFilm2_04.jpg" width="341" />
        </div>
        <div class="fond">
            <asp:placeholder id="PlaceHolder" runat="server"></asp:placeholder>
        </div>
        <div>
        </div>
        <div class="bas">Copyright © 2002-2004 Bolo Michelin Tout drois réservés <a href="http://www.independza.com">Team
            independza</a> <a href="http://www.mozilla.org/products/firefox/"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 80px; BORDER-RIGHT-WIDTH: 0px" alt="le site s'affiche mieux dans un navigateur conforme aux normes CSS et HTML du W3C" src="images/get.gif" align="middle" /></a> <a href="http://jigsaw.w3.org/css-validator/"><img style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 65px; HEIGHT: 23px; BORDER-RIGHT-WIDTH: 0px" alt="Valid CSS!" src="http://jigsaw.w3.org/css-validator/images/vcss.png" align="middle" /></a>
        </div>
    </form>
</body>
</html>
 
Nouveau WRInaute
Bonjour,
je poste ici car le titre de sujet semble correspondre, mais si je me suis égaré, pardonnez moi d'avance ;)

J'ai un problème sur le positionnement, au sein de ma page, du menu CSS que je souhaite utiliser :
exemple

Le problème est le suivant : l'image censée être présente à gauche m'oblige à décaler mon menu à droite, et la bannière du site normalement située au dessus de mon menu m'oblige à le décaler vers le bas.
Le plus important est que je garde cette mise en page.
En jouant sur le CSS je peux parfaitement décaler le menu et le placer correctement comme sur l'exemple.
Mais dès que je redimensionne ma fenêtre ou bien que je change de résolution, le menu se décale irrémédiablement à un endroit toujours plus folklorique :D

Alors auriez vous un moyen de fixer ce menu une fois pour toute ?
Sinon, auriez vous un autre type de menu à me conseiller ? (Mais j'avoue que les menus CSS semblent être les meilleurs)

Merci d'avance ;)
 
Nouveau WRInaute
Pour ceux à qui il manquait le fichier CSS je vous le mets là :
Code:
dt, dl, dd, ul, li {
list-style-type: none;
margin: 0 15px 0 0;
padding: 0;
}

#menu {
position:absolute;
cursor:pointer;
white-space:nowrap;
margin:0 0 0 auto;
left:415px;
top:161px;
color:#FDECC8;
padding:0;
font: 0.9em "Times New Roman";
}
.righted {margin:0 0 0 auto;}

#menu dl {
float: left;
}
#menu li {
display: inline;
}

#menu a {
text-decoration: none;
color: #FDECC8;
/*background: #fff;*/
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5, #smenu6, #smenu7 {
position: absolute;
text-align:left;
left: 0;
top: 21px;
font-size: 0.9em;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a, #smenu7 a{
color: #8B190F;
}

Et pour clarifier ma question :
Est-il possible de décaler mon menu vers la droite d'un certain nombre de pixels, puis de centrer le "menu+le décalage" pour obtenir ainsi un menu globalement centré mais avec un léger décalage vers la droite ?
 
WRInaute discret
Soit tu réduis le width de ton menu , soit tu combat le mal par le mal en appliquant des hacks CSS car ce probléme est dû aux différentes méthodes de calculs des tailles entre IE et FF , par exemple , FireFox aggrandit le bloc s'il contient des paddings contrairement à IE qui ne change rien dans la taille du bloc !
Fait deux déclarations de tailles dans ta CSS , une calculée pour marcher avec FF ( à laquelle doit être ajouter html>body avant le nom du bloc ) et une pour IE ( sans préfixe ) .
 
Nouveau WRInaute
Merci tout le monde,

le poste de e-kiwi, même si j'ai été voir ce site déjà auparavant, m'a aidé à trouver la solution.

En fait il fallait que je fasse un positionnement relatif et ensuite que je décale avec un margin-left. Et maintenant ça marche. C'est sans doute une solution très facile mais puisque je ne suis pas du tout un MAITRE en CSS, c'était déjà trop pour moi ;)

Merci donc et bonne continuation!
 
Nouveau WRInaute
Excusez moi, je reviens à l'attaque lol

Je me suis un peu avancé l'autre fois en disant que le problème était réglé, car certes il l'est mais que sur Firefox, pas sur IE.

Quelqu'un pourrait-il m'aider à adapter ce code pour que ça marche aussi sur IE ?

Code:
dt, dl, dd, ul, li {
list-style-type: none;
margin: 0 15px 0 0;
padding: 0;
}

#menu {
position:relative;
cursor:pointer;
white-space:nowrap;
margin:0 0 0 auto;
left:170px;
top:151px;
color:#FDECC8;
padding:0;
font: 0.9em "Times New Roman";
}

#menu dl {
float: left;
}
#menu li {
display: inline;
}

#menu a {
text-decoration: none;
color: #FDECC8;
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5, #smenu6, #smenu7 {
position: absolute;
text-align:left;
left: 0;
top: 23px;
font-size: 0.9em;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a, #smenu7 a{
color: #8B190F;
}

Je n'ai vraiment aucune idée de comment faire et malheureusement le temps me presse. Je vais continuer de chercher bien sur mais si une âme charitable passe par là...

Merci d'avance ;)
 
Nouveau WRInaute
Et bien là c'est Lord_Coder que je peux remercier car j'ai reregardé le site qu'il me conseillait, et effectivement son Holly Hack marche nickel ;)

Merci
 

➡️ Offre MyRankingMetrics ⬅️

pré-audit SEO gratuit avec RM Tech (+ avis d'expert)
coaching offert aux clients (avec Olivier Duffez ou Fabien Faceries)

Voir les détails ici

coaching SEO
Discussions similaires
Haut