Probleme de DIV CSS
Résolu/Fermé
koonreed
-
3 avril 2009 à 01:13
JLgreg Messages postés 2 Date d'inscription lundi 1 février 2010 Statut Membre Dernière intervention 1 février 2010 - 1 févr. 2010 à 16:48
JLgreg Messages postés 2 Date d'inscription lundi 1 février 2010 Statut Membre Dernière intervention 1 février 2010 - 1 févr. 2010 à 16:48
A voir également:
- Probleme de DIV CSS
- Div c++ - Télécharger - Langages
- Css exposant ✓ - Forum CSS
- Moyenne.si.ens #div/0 ✓ - Forum Excel
- Enlever couleur lien css ✓ - Forum CSS
- Css download - Télécharger - HTML
3 réponses
gryzzly
Messages postés
4608
Date d'inscription
lundi 7 novembre 2005
Statut
Contributeur
Dernière intervention
24 octobre 2020
1 335
3 avril 2009 à 01:36
3 avril 2009 à 01:36
elle vient de la configuration des feuilles de style par défaut des navigateurs.
une balise <p></p> a un margin/padding par défaut :o)
on utilise donc couramment un "css reset" :
https://meyerweb.com/eric/tools/css/reset/
par exemple.
Ca permet de remettre à zero la majorité des propriétés par défaut des navigateurs.
une balise <p></p> a un margin/padding par défaut :o)
on utilise donc couramment un "css reset" :
https://meyerweb.com/eric/tools/css/reset/
par exemple.
Ca permet de remettre à zero la majorité des propriétés par défaut des navigateurs.
JLgreg
Messages postés
2
Date d'inscription
lundi 1 février 2010
Statut
Membre
Dernière intervention
1 février 2010
1 févr. 2010 à 16:48
1 févr. 2010 à 16:48
Bonjour,
Je viens de créer un site internet pour la première fois (donc novice) et j'ai une différence d'affichage entre Firefox et IE7.
Donc sous Firefox voila ce que j'ai et c'est ce que je souhaite au final:
https://track.vcdc.com/proceed.php?domain=imagehotel.net&hash=762a165b2b956805ef3c0fcdd6c0d981&u=eyJkb21haW4iOiJpbWFnZWhvdGVsLm5ldCIsImRvbWFpbl9pZCI6IjYzNzI3OTAiLCJmb2xkZXJfaWQiOm51bGwsIm1pZCI6IjE1MSIsImZpbHRlcl9pZCI6bnVsbCwiYWR2ZXJ0aXNlcl9pZCI6IjgiLCJ0YXJnZXQiOiJodHRwOlwvXC9tZWxhbnRoaW9zLWFuYS5jb21cL3pjdmlzaXRvclwvZDA0MTNjYTEtMzc1Yi0xMWViLWJkZWEtMGExOWJjNTA5MjlmXC82MDE5MTczYi02NzVlLTQ4NTItOThmNC1kNGY0N2VkYmI5NzI/Y2FtcGFpZ25pZD00N2Y4Mzc2MC1mMTE4LTExZWEtOWJjOC0wYWMyYmJmNGFkYTciLCJpcF9hZGRyZXNzIjoiOTEuMjA5LjM1LjIxOCIsInR5cGUiOiJqYXZhX3JlZGlyZWN0IiwiYmlkIjoiMC4wMDU1MiJ9
Et sous IE7 mon Logo est décaler et n'est plus aligner avec mon menu:
http://images.imagehotel.net/?ej2q41ngki.jpg
Voici le code html de ma page:
<body>
<div id="wrapper">
<div id="header">
<div id="titre">
<h3>Bureau d'etudes industiel</h3>
</div>
<div id="menu">
<ul>
<li class="active"><a href="index.html">Accueil</a></li>
<li><a href="implantation.html">Implantation</a></li>
<li><a href="activites.html">Activités</a></li>
<li><a href="secteurs.html">Secteurs</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</div>
<div id="logo">
</div>
</div>
<div id="page">
<h1>A2GH Technologies</h1>
<h2>Présentation:</h2>
<p class="page1">La société A2GH-Technologies est un bureau d'études, en sous traitance, de conception de produits industriels en CAO 3D. Elle a été créée par 4 associés au profil varié : un pilote étude, deux projeteurs et un dessinateur.
<h2>Création:</h2>
<p class="page1">C'est une entreprise jeune qui a ouvert ses portes en début d'année 2010, dans l'allant de la reprise d'activité suite à la crise financière de 2009.</p>
<h2>Le projet:</h2>
<p class="page1">L'entreprise a la possibilité de travailler soit en prestation globale en interne, soit en intervention chez ses clients avec l'ambition d'internaliser ces projets à longs termes.
<br />De plus la maîtrise technique d'une équipe polyvalente et complémentaire permet d'assurer le suivi des études, de la recherche et du développement avec nos clients.
<br />
Enfin la hiérarchie simple de notre petite structure nous permet d'être réactifs et efficaces.</div>
<div id="footer">
<p>A2GH-Technologies
</div>
</div>
</body>
</html>
Et le CSS qui va avec (pour le header):
#wrapper {
}
#logo {
height: 160px;
width: 200px;
background-image: url(../images/Logo.png);
background-repeat: no-repeat;
background-position: center center;
margin-top: 1px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#header {
height: 160px;
width: 900px;
margin-top: 0;
margin-right: auto;
margin-bottom: 5px;
margin-left: auto;
}
#titre {
width: 700px;
float: right;
height: 120px;
}
#menu {
height: 40px;
width: 700px;
float: right;
}
#menu ul {
list-style-type: none;
margin-top: 5px;
padding: 0px;
margin-left: 55px;
}
#menu ul li {
}
#menu ul li a {
display: block;
margin-right: 15px;
text-decoration: none;
text-transform: capitalize;
font-size: 16px;
padding-top: 2px;
padding-right: 20px;
padding-bottom: 2px;
padding-left: 20px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
float: left;
color: #000;
margin-top: 2px;
}
#menu a:hover, #menu .active a {
color:#fff;
background-image: url(../images/Bouton.png);
background-repeat: repeat-x;
}
Voila je cherche sur google depuis un petit moment maintenant donc si quelqu'un pouvait m'aider ce serait génial.
Je viens de créer un site internet pour la première fois (donc novice) et j'ai une différence d'affichage entre Firefox et IE7.
Donc sous Firefox voila ce que j'ai et c'est ce que je souhaite au final:
https://track.vcdc.com/proceed.php?domain=imagehotel.net&hash=762a165b2b956805ef3c0fcdd6c0d981&u=eyJkb21haW4iOiJpbWFnZWhvdGVsLm5ldCIsImRvbWFpbl9pZCI6IjYzNzI3OTAiLCJmb2xkZXJfaWQiOm51bGwsIm1pZCI6IjE1MSIsImZpbHRlcl9pZCI6bnVsbCwiYWR2ZXJ0aXNlcl9pZCI6IjgiLCJ0YXJnZXQiOiJodHRwOlwvXC9tZWxhbnRoaW9zLWFuYS5jb21cL3pjdmlzaXRvclwvZDA0MTNjYTEtMzc1Yi0xMWViLWJkZWEtMGExOWJjNTA5MjlmXC82MDE5MTczYi02NzVlLTQ4NTItOThmNC1kNGY0N2VkYmI5NzI/Y2FtcGFpZ25pZD00N2Y4Mzc2MC1mMTE4LTExZWEtOWJjOC0wYWMyYmJmNGFkYTciLCJpcF9hZGRyZXNzIjoiOTEuMjA5LjM1LjIxOCIsInR5cGUiOiJqYXZhX3JlZGlyZWN0IiwiYmlkIjoiMC4wMDU1MiJ9
Et sous IE7 mon Logo est décaler et n'est plus aligner avec mon menu:
http://images.imagehotel.net/?ej2q41ngki.jpg
Voici le code html de ma page:
<body>
<div id="wrapper">
<div id="header">
<div id="titre">
<h3>Bureau d'etudes industiel</h3>
</div>
<div id="menu">
<ul>
<li class="active"><a href="index.html">Accueil</a></li>
<li><a href="implantation.html">Implantation</a></li>
<li><a href="activites.html">Activités</a></li>
<li><a href="secteurs.html">Secteurs</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</div>
<div id="logo">
</div>
</div>
<div id="page">
<h1>A2GH Technologies</h1>
<h2>Présentation:</h2>
<p class="page1">La société A2GH-Technologies est un bureau d'études, en sous traitance, de conception de produits industriels en CAO 3D. Elle a été créée par 4 associés au profil varié : un pilote étude, deux projeteurs et un dessinateur.
<h2>Création:</h2>
<p class="page1">C'est une entreprise jeune qui a ouvert ses portes en début d'année 2010, dans l'allant de la reprise d'activité suite à la crise financière de 2009.</p>
<h2>Le projet:</h2>
<p class="page1">L'entreprise a la possibilité de travailler soit en prestation globale en interne, soit en intervention chez ses clients avec l'ambition d'internaliser ces projets à longs termes.
<br />De plus la maîtrise technique d'une équipe polyvalente et complémentaire permet d'assurer le suivi des études, de la recherche et du développement avec nos clients.
<br />
Enfin la hiérarchie simple de notre petite structure nous permet d'être réactifs et efficaces.</div>
<div id="footer">
<p>A2GH-Technologies
</div>
</div>
</body>
</html>
Et le CSS qui va avec (pour le header):
#wrapper {
}
#logo {
height: 160px;
width: 200px;
background-image: url(../images/Logo.png);
background-repeat: no-repeat;
background-position: center center;
margin-top: 1px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#header {
height: 160px;
width: 900px;
margin-top: 0;
margin-right: auto;
margin-bottom: 5px;
margin-left: auto;
}
#titre {
width: 700px;
float: right;
height: 120px;
}
#menu {
height: 40px;
width: 700px;
float: right;
}
#menu ul {
list-style-type: none;
margin-top: 5px;
padding: 0px;
margin-left: 55px;
}
#menu ul li {
}
#menu ul li a {
display: block;
margin-right: 15px;
text-decoration: none;
text-transform: capitalize;
font-size: 16px;
padding-top: 2px;
padding-right: 20px;
padding-bottom: 2px;
padding-left: 20px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
float: left;
color: #000;
margin-top: 2px;
}
#menu a:hover, #menu .active a {
color:#fff;
background-image: url(../images/Bouton.png);
background-repeat: repeat-x;
}
Voila je cherche sur google depuis un petit moment maintenant donc si quelqu'un pouvait m'aider ce serait génial.
