28220 sujets

CSS et mise en forme, CSS3

En fait je débute, et j'ai refait une partie du site de ma boîte en css (alors qu'il était fait en tableau et je dois dire que je l'ai fait en visionnant sur IE) mais en vérifiantsur netscpae et firefox, ça ne se positionne pas correctement et mon pied de page se retrouve déplacé en haut...

J'ai commencé les css hier donc un peu d'indulgence svp.

le site : http://www.prepa-isp.fr/formationcontinue/evocond.htm


Toutes les pages sur la formation continue sont en css et la feuille de style est dispo http://www.prepa-isp.fr/style.css


Voilà je sais qu'il y a pas mal d'erreurs, mais je ne fais que débuter et déjà conquis par les css mais un peu d'aide serait bien venue

Merci
Modifié par Guyome (14 Oct 2005 - 08:16)
Bonjour Guyome et bienvenue sur ce forum.

Est-ce que tu pourrais utiliser le BBCode [ code][/code ] à la place de [ quote][/quote ] pour baliser ton code ? C'est fait pour ça Smiley cligne

/* éléments de mise en page du texte */
body {
font: 8pt/16pt verdana, sans-serif;
color: #000;
background: #CCC;
margin: 0;
}
p {
font: 8pt/16pt verdana, sans-serif;
margin: 0;
line-height: 1.5em;
}

}
h1 {
line-height: 50%;
font: bold 12pt verdana, sans-serif;
letter-spacing: 1px;
color: #000;
text-align: center;
border-bottom: 1px solid #f00;
}
h2 {
font: bold 10pt verdana, sans-serif;
color: #000;
text-decoration: underline;
margin-top: 15px;
margin-bottom: 5px;
}
h3 {
font: italic bold 40pt verdana, sans-serif;
letter-spacing: 2px;
color: #696969;
}
a:link {
text-decoration: none;
color: #000;
}
a:visited {
text-decoration: none;
color: #000;
}
a:hover {
text-decoration: underline;
color: #f00;
}
a:activate {
font: bold;
text-decoration: none;
color: #f00;
}
span {
font: bold 40pt verdana,sans-serif;
color : #696969
}
.pcentre {
font: 8pt/16pt verdana, sans-serif;
margin: 0;
line-height: 1.5em;
text-align: center;
}
/* menus */
ul#menu1 {
margin: 0;
paddin: 0;
font: 10pt verdana, sans-serif;
list-style-type: none;
line-height: 30px;
}
ul#menugeneral {
margin: 50px 0px 0px 0px;
paddin: 0;
font: 10pt verdana, sans-serif;
list-style-type: none;
line-height: 20px;
border-top: 1px solid #f00;
border-bottom: 1px solid #f00;
}

/* disposition des blocs */
#conteneur {
width: 950px;
padding: 20px 20px 20px 60px;
background-color: #CCC;
}
#entetegauche {
float: left;
height: 75px;
width: 250px;
background-color: #CCC;
color: #696969;
font: bold 15pt Verdana;
text-align: center;
}
#entetedroit {
float: left;
height: 75px;
width: 600px;
background-color: #CCC;
color: black;
text-align: center;
margin: 0;
}
#menu {
float: left;
padding: 25px 0px 20px 0px;
width: 250px;
background-color: #CCC;
}
#description {
float: left;
padding: 10px 10px 10px 10px;
width: 600px;
background-color: #CCC;
text-align: justify;
border-left: 1px solid #f00;
}
#pied {
float: bottom;
height : 20px;
width: 950px;
margin-top: 10px;
background-color: #FFF;
border-top: 1px solid #f00;
text-align: center;
}



Voila pour le CSS


et voila pour le HTML


<body>
<div id="conteneur">
<a href="http://www.prepa-isp.fr"><div id="entetegauche">Groupe <span>ISP</span></div></a>
<div id="entetedroit">
<h3>Evolutions</h3></div>
<div id="menu"><ul id="menu1">
<li><a href="http://www.prepa-isp.fr/formationcontinue/evoisp.htm">Le Groupe ISP</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evoforoblig.htm">La formation continue des Avocats</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evothemes.htm">Les thèmes traités</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evoform.htm">Des formations à la carte</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evointer.htm">Les intervenants</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evocond.htm">Les conditions d'inscriptions</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evosupp.htm">Des supports écrits</a></li>
<li><a href="http://www.prepa-isp.fr/formationcontinue/evodossierinscrip.htm">Dossier d'inscription</a></li></ul>
<ul id="menugeneral">
<li><a href="mailto:%73%65%63%72%65%74%61%72%69%61%74%40%70%72%65%70%61%2D%69%73%70%2E%66%72">Contact</a></li>
<li><a href="http://www.prepa-isp.fr/Situation.htm">Se rendre au Groupe ISP</a></li>
<li><a href="http://www.prepa-isp.fr/logements.htm">Hébergement</a></li>
<li><a href="http://www.prepa-isp.fr/plansiteisp.htm">Plan du site</a></li>
<li><a href=""></a></li>
<li><a href="http://www.prepa-isp.fr">Menu principal</a></li></ul></div>
<div id="description">
<h1>CONDITIONS D'INSCRIPTION AUX FORMATIONS</h1>
<h2>LES TARIFS</h2>
<p>380 € par thème de 10 heures</p>
<h2>LES HORAIRES</h2>
<p>Horaires :	19 heures - 23 heures (dont 40 mn de pause)
soit un total de 10 heures effectives sur les 12 heures de présence</p>
<h2>LES PLATEAUX-REPAS</h2>
<p>Les sessions Evolutions ayant lieu de 19 h à 23 h, nous avons prévu 40 mn de pause à  21 heures.
Ceux qui le souhaitent peuvent bénéficier d'un plateau-repas. Cette option facultative est facturée 90 € par séminaire de trois soirs et doit être prévue au minimum 6 jours à l'avance.</p>
<h2>LES EFFECTIFS</h2>
<p>Nombre minimum d'avocats par formation :	8
Nombre maximum d'avocats par formation :	35</p></div>
<div id="pied">Evolutions - Département formation continue du Groupe ISP - N° 11753990075 - 18, rue de Varenne, 75007 PARIS - 01.42.22.30.60</div>
</div>
</body>
</html>


J'ai pas réussi à éditer mon post. Je vais réessayer.
Ca y est c'est modifié !!! Smiley rolleyes
Désolé
Modifié par Guyome (13 Oct 2005 - 15:47)
Une petite aide svp car je ne comprends pas réellement opurquoi ça ne fonctionne pas...

Merci par avance
Certaines balises ont des marges par défaut selon les navigateurs, qui ne sont pas les mêmes : les p, les h par exemple. Ton titre est dans une balise h3, il ta faut supprimer les marges "par défaut" avant de le positionner.
Administrateur
Guyome a écrit :
Fabuleux...

Merci pour tout. Tout ça pour une histoire de marges...
Smiley lol

Pourtant j'ai lu le livre... Smiley biggol

Page 27, le petit encard "marges par défaut" Smiley cligne

Sinon, je rappelle que la FAQ est prévue pour répondre aux questions les plus fréquentes (dont celles-ci) Smiley smile