28221 sujets

CSS et mise en forme, CSS3

Bonjour,
J'ai longuement hésité à mettre ce post mais je n'ai pas trouvé ce qui cloche. J'ai fait des recherches mais je suis nouvelle en la matière.

Bien, j'ai fait ma page CSS avec l'aide d'un pote pour les corrections. Puis j'ai voulu mettre des zones cliquables enfain d'enlever les map. Et c'est là que j'ai du faire une borde! Normalement, j'ai un header avec une image en fond sur laquelle j'ai du texte, un menu à gauche avec pareil et un conteneur. Donc j'ai fait mon code pour mettre mes zones cliquables.. mais ça a tout chamboulé. Et j'ai pas mes zones... J'ai vérifié ma grammaire css W3C c'est correcte. Pour la page index.html, je sais que j'ai mis du javascript qui ne va pas en vérification stricte. Mais bon c'est pas un souci je peux virer et faire autrement.
Voici mon code CSS:
/* définition par défaut pour tous les éléments: * */
* {
	font-family : Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0px;
	padding:0px;
	border:0px none; 
}


body  {
	background-color:#ffffff;
	margin:auto;
}

#header {
	height:159px;
	background:url('http://lamaisonnettedemokao.free.fr/images/arbre_automne2_01.gif');
	background-repeat:no-repeat;
}

/* elements du menu de gauche*/
#menugauche {
   float: left;
   padding-top: 10px;
   width: 192px;
   height: 525px;
   background-image:url('http://lamaisonnettedemokao.free.fr/images/arbre_automne2_02.gif');
   background-repeat: no-repeat;
   list-style-type: none;
}

#menugauche a{
	width:120px;
	height:25px;
	margin-left:33px;
	margin-top:60px;
	text-decoration:none;
}

#menugauche a:hover {
	border:dashed 1px;
	border-color: #FFFACD;
}

/* elements masques */
#menugauche a i {
	visibility:hidden;
	text-decoration:none;
	font-size:1px;
}


/* Les éléments du menu du haut*/
#menuhaut {
   float: left;
   padding-top: 10px;
   width: 192px;
   height: 525px;
   background-image:url('http://lamaisonnettedemokao.free.fr/images/arbre_automne2_01.gif');
   background-repeat: no-repeat;
   list-style-type: none;
}

#menuhaut a{
	width:100px;
	height:25px;
	margin-left:45px;
	margin-top:100px;
	text-decoration:none;
}

#menuhaut a:hover {
	border:dashed 1px;
	border-color: #FFFACD;
}

/* elements masques */
#menuhaut a i {
	visibility:hidden;
	text-decoration:none;
	font-size:1px;
}
#contenu {
	width:664px;
	height:525px;
	padding:10px;
	margin:0px;
	background:url('http://lamaisonnettedemokao.free.fr/images/arbre_automne2_03.gif');
	background-repeat:no-repeat;
	overflow:auto;
}

#croixrouge {
	display:block;
	margin-top:-100px;
	margin-right:1000px;
	padding:0px;
	width:175px;
	height:48px;
}


/* styles de textes et mise en page */
p  	{ 
	color: black;
	margin-top:5px;
	margin-right:45px; 
	text-align: justify; 
	text-indent: 0px; 
}



h1  { 
	color: rgb(68,88,11);
	margin-right:45px;
	font-size: small; 
	text-decoration: blink; 
	text-align: justify; 
	text-transform: uppercase; 
	border-bottom: 2px double black; 
}

h2  { 
	margin-top: 45px;
	margin-left:77px;
}

P:first-letter {
	font-weight: bold;
	font-size: 100%;
}

ul {
	list-style-type: circle;
	list-style-position: inside;
	border: none;
}

/* definitions des liens */
a  { 
	color: black; 
	font-style: italic; 
	text-decoration: none; 
}

a:visited /* Quand le visiteur a déjà vu la page concernée */ { 
	text-decoration: underline; 
}

a:active, a:focus /* Appliquer le même style aux liens actifs et focus */ { 
	text-decoration: underline; 
	background-color: #ffcc66; 
}

a:hover /* Quand le visiteur pointe sur le lien */{
	text-decoration: underline; /* Le lien deviendra souligné quand on pointera dessus */
	color: green; /* Le lien sera écrit en vert quand on pointera dessus */
}

Pour voir le résultat cliquez: ICI. C'est affreux et nul mais bon faut que j'assume j'ai fait une bourde...

Merci de m'aider à comprendre mon erreur. Smiley sweatdrop
Vous savez quoi??? J'y suis enfin arrivée!!! Smiley lol Smiley lol Smiley lol Smiley lol J'ai changé tout mon design pour refaire autrement. Du coup j'ai listé, et du coup j'ai phpincludé! Mon site est pas fini dans son contenu mais tout fonctionne. Après quand tout sera fin prêt.. j'irais le passer au W3C!!! Merci à ce site et ce forum car c'est en fouillant de partout que j'ai capté plein plein de choses!
Si je peux aider quelqu'un malgré mon pauvre niveau je le ferais avec plaisir. Smiley smile
Modifié par Mokao (01 Mar 2005 - 15:55)