Page 1 sur 1

Probleme CSS

Posté : 23 mars 2011, 18:48
par juju.92
Bonjour à vous ,
Je viens demander un peu d'aide sur ce forum car il s'avère que je suis bloqué dans l'écriture de mon site ... :cry:
Voila ce que j'obtiens en faisant un impécr :

http://img202.imageshack.us/i/imprecranv.jpg/

Voici le Css :

Code : Tout sélectionner

body{ background:#26211d; margin:0; padding:0; font-family:Verdana, Geneva, sans-serif; font-size:12px; color:FFFFFF; } /* /////////////////////////////// HEADER ////////////////////////////////*/ #header{ height:278px; margin:-20px 0 0 0; background:url(theme/titre.png) no-repeat top center; } /* /////////////////////////////// footer ////////////////////////////////*/ #menufooter_livre_or ul li{ list-style:none; float:left; padding:0; } #menufooter_livre_or ul li a{ height:66px; width:175px; background:url(theme/bouton_livre_or.png) no-repeat top left; display:block; } #menufooter_livre_or ul li a:hover{ background-position:bottom left; } #menufooter_telechargements ul li{ list-style:none; float:left; padding:0; } #menufooter_telechargements ul li a{ height:66px; width:250px; background:url(theme/bouton_telechargements.png) no-repeat top left; display:block; } #menufooter_telechargements ul li a:hover{ background-position:bottom left; } }/* /////////////////////////////// CONTENU ////////////////////////////////*/ #conteneur{ position:relative; width:838px; height:1318px; margin:0 auto; background:no-repeat top center #FFFFFF; } #a_la_une{ position:absolute; height:296px; width:838px; margin:80px 0 0 0; background:url(theme/cadre_a_la_une.png) no-repeat top center; } #breves{ position:absolute; top:664px; height:173px; width:563px; background:url(theme/cadre_breves.png) no-repeat left; } #articles{ position:absolute; top:847px; height:299px; width:562px; background:url(theme/cadre_articles.png) no-repeat left; } #commentaires{ position:absolute; left:569px; top:665px; height:479px; width:269px; background:url(theme/cadre_commentaires.png) no-repeat right; } #footer{ position:absolute; height:152px; width:838px; bottom:11px; background:url(theme/cadre_footer.png) no-repeat center; }
et le html :

Code : Tout sélectionner

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title> Julien-ultra </title> <link href="style.css" rel="stylesheet" type="text/css" media="screen" </head> <body> <div id="conteneur"> <div id="header"></div> <div id="a_la_une"></div> <div id="breves"></div> <div id="articles"></div> <div id="commentaires"></div> <div id="footer"></div> <div id="menufooter_telechargements"> <ul> <li><a href="#"></a></li> </ul> </div> </div> </body> </html>
Voila je ne comprend pas d'un seul coup en rechargeant ma page dans le navigateur tout mon conteneur contenant les images " a_la_une", "brèves", etc s'est décalé sur la gauche alors qu'il était centré avant ...
Je ne vois pas comment faire pour le recentrer puisque je n'ai normalement rien touché ...
De plus l'image du footer n'apparait plus depuis le décalage du conteneur ...
Enfin comme vous pourrez le remarquer dans le css j'ai mis une couleur blanche ( #FFFFFF) au conteneur et celle ci ne veux pas apparaitre .

Deuxièmement je n'arrive pas à décaler mon menu , dans l'image que je vous ai fourni , on observe le bouton téléchargements qui apparait en haut mais je n'arrive pas à le placer ou je veux ...celui-ci doit normalement être en bas dans sur l'image footer ...

J'espère que quelqu'un prendra le temps de bien vouloir me répondre et j'espère surtout trouver une réponse ... :priere:
Merci d'avance,
Cordialement.

Re: Probleme CSS

Posté : 23 mars 2011, 19:18
par misterflo
Salut,
plusieurs petites soucis.

Dans ta page html, ta balise <link /> dans le head n'est pas fermée.

Ensuite dans ton css tu as un bloque de commentaire qui pose problème.

Code : Tout sélectionner

}/* /////////////////////////////// CONTENU ////////////////////////////////*/
Comme tu le vois, il y a une accolade au début de ton bloque qui n'a rien à faire là !

Les position: absolute pour placer les bloques c'est vraiment bof bof ^^'

Re: Probleme CSS

Posté : 23 mars 2011, 20:33
par juju.92
Salut merci pour ta réponse , c'est l'accolade dans le commentaire qui faisait tout foiré , je ne l'avais pas vu merci beaucoup ! , ça remarche maintenant =D>
Pourquoi positionner les blocs en absolu c'est bof bof ? Comment faire autrement ?
Moi tout ce que je vois c'est que pour l'instant ça marche alors quand on est débutant on se pose pas trop de question mais je veux bien que tu m'éclaircisses ;)

Sinon comment déplacer mon bouton "telechargement" ?

Merci d'avance,
Cordialement

Re: Probleme CSS

Posté : 23 mars 2011, 21:08
par misterflo
Les position: absolute c'est bien pour quelques trucs, pour la mise en page des bloques comme la tienne, je préfèrerais utiliser les float (mais ce n'est qu'un avis personnel ^^)