probleme css avec mon footer

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : probleme css avec mon footer

par patrick777 » 07 janv. 2009, 19:10

Oui, je sais, le site du zero est bien fait, et concernant la divite, c'est un kit grphique gratuit...

par Victor BRITO » 04 janv. 2009, 21:59

Sinon pour apprendre un bon moyen c'est encore de lire (soit sur le web soit dans des livres).
À commencer par le site du zéro et Alsacréations. Ce sera d'autant moins superflu que, sémantiquement parlant, il y a encore du boulot à faire côté (X)HTML (puisqu'il faut soigner la divite ;) ).

par Stef » 04 janv. 2009, 20:19

Colle ça dans ton css:

Code : Tout sélectionner

.spacer { clear: both; }
Et juste avant ton <div id="footer">

Tu ajoute excatement ça (rien de plus):

Code : Tout sélectionner

<div class="spacer"></div>
Enregistres tes fichiers, actualises ton navigateur, et ça devrait rouler...

Sinon pour apprendre un bon moyen c'est encore de lire (soit sur le web soit dans des livres).

par patrick777 » 04 janv. 2009, 20:08

Non non, je t'assure, je suis nul, j'apprends certes un peu, mais je bidouilles plus que je n'apprends, neamoins, il est vrai qu'a force de passer des heures, des jours et parfois des semaines a essayer quelquechose, la perceverence paye souvent mais sans compter l'aide de quelqu'un dans mon cas.

J'ai fait ce que tu m'as dit mais ca ne change rien, ou peut etre je me suis trompe ( desole pour le manque d'accents dans mon texte mais c'est l'ordi de ma copine Polonaise, donc pas d'accents...fin de la parenthese :oops: :oops: )

Je te met le code css et html, peut etre tu verras quelque chose, en tout cas, merci beaucoup.


Code : Tout sélectionner

@charset "utf-8"; /* CSS Document */ body{ margin:0; color:#232323; padding-top: 0px; padding-right: 0; padding-bottom: 0; padding-left: 0; background-attachment: scroll; background-image: url(images/bg.jpg); background-repeat: repeat-x; background-position: top; background-color: #f7fcf8; } div, h1, h2, h3, h4, p, form, label, input, textarea, img, span{ margin:0; padding:0; } ul{ margin:0; padding:0; list-style-type:none; font-size:0; line-height:0; } .spacer{ clear:both; font-size:0; line-height:0; } /*------------------------------------------------topheader--------------------*/ #topheader{ width:1004px; height:146px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; font-family: Tahoma; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #dcd66e; text-decoration: none; padding: 0px; float: none; background-image: url(images/topbanner_bg.jpg); background-repeat: no-repeat; background-position: center; } .logo { background-image: url(images/logo.png); background-repeat: no-repeat; padding: 0px; float: left; height: 95px; width: 321px; margin-top: 30px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } .menu_area { float: left; margin-top: 58px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .menu_text { font-family: Arial; font-size: 17px; font-weight: normal; font-variant: normal; text-transform: none; color: #bbbbbb; text-decoration: none; } .ideas { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #5a5a5a; text-decoration: none; background-image: url(images/menu_01.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 61px; } .ideas:hover { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #ffffff; text-decoration: none; background-image: url(images/menu_01.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 61px; } .links { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #5a5a5a; text-decoration: none; background-image: url(images/menu_02.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 59px; } .links:hover { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #ffffff; text-decoration: none; background-image: url(images/menu_02.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 59px; } .info{ font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #5a5a5a; text-decoration: none; background-image: url(images/menu_03.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 60px; } .info:hover{ font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #ffffff; text-decoration: none; background-image: url(images/menu_03.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 100px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 60px; } .works { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #5a5a5a; text-decoration: none; background-image: url(images/menu_04.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 105px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 60px; } .works:hover { font-family: Arial; font-size: 20px; font-weight: normal; text-transform: lowercase; color: #ffffff; text-decoration: none; background-image: url(images/menu_04.png); background-repeat: no-repeat; margin: 0px; float: left; height: 70px; width: 105px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 60px; } /*------------------------------------------------search_strip-------------------*/ #search_strip{ width:1004px; height:76px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; font-family: Tahoma; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #dcd66e; text-decoration: none; padding: 0px; float: none; background-image: url(images/search_strip.jpg); background-repeat: no-repeat; background-position: center; }.freeregistration { margin: 0px; float: left; height: 58px; width: 300px; padding-top: 18px; padding-right: 0px; padding-bottom: 0px; padding-left: 343px; } .registration { font-family: "Arial Narrow"; font-size: 33px; font-weight: normal; color: #000000; text-decoration: none; } .free { font-family: "Arial Black"; font-size: 33px; font-weight: normal; color: #da2a2a; text-decoration: none; background-image: url(images/registration.png); background-repeat: no-repeat; height: 48px; padding-top: 0px; padding-right: 53px; padding-bottom: 0px; padding-left: 0px; float: left; margin-top: 0px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; background-position: right; } .free:hover { font-family: "Arial Black"; font-size: 33px; font-weight: normal; color: #000000; text-decoration: none; background-image: url(images/registration.png); background-repeat: no-repeat; height: 48px; padding-top: 0px; padding-right: 53px; padding-bottom: 0px; padding-left: 0px; float: left; margin-top: 0px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; background-position: right; } .search_area { float: left; height: 58px; width: 300px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; background-image: url(images/search.png); background-repeat: no-repeat; margin-top: 18px; margin-right: 0px; margin-bottom: 0px; margin-left: 50px; } .search_box { margin: 0px; float: left; height: 24px; width: 165px; padding-top: 5px; padding-right: 0px; padding-bottom: 0px; padding-left: 50px; color: #b2d2d5; } .searchtextbox { font-family: Arial; font-size: 10px; font-weight: normal; color: #000000; text-decoration: none; margin: 0px; padding: 0px; float: left; height: 18px; width: 158px; border: 1px solid #999999; } .searchtextbox:hover { font-family: Arial; font-size: 10px; font-weight: normal; color: #000000; text-decoration: none; margin: 0px; padding: 0px; float: left; height: 18px; width: 158px; border: 1px solid #333333; } .search_go{ margin: 0px; float: left; height: 24px; width: 35px; padding-top: 4px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .go { font-family: Arial; font-size: 11px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-image: url(images/go.png); background-repeat: no-repeat; margin: 0px; float: left; height: 18px; width: 34px; padding-top: 4px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .go:hover { font-family: Arial; font-size: 11px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-image: url(images/go1.png); background-repeat: no-repeat; margin: 0px; float: left; height: 18px; width: 34px; padding-top: 4px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .advancesearch { font-family: Arial; font-size: 11px; font-weight: bold; text-transform: none; color: #da2a2a; text-decoration: none; } .advancesearch:hover { font-family: Arial; font-size: 11px; font-weight: bold; text-transform: none; color: #000000; text-decoration: none; } /*------------------------------------------------body_area--------------------*/ #body_area{ width:1004px; height:820px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; font-family: Tahoma; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #dcd66e; text-decoration: none; float: none; padding-top: 52px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } #innerbody_area{ width:1004px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; font-family: Tahoma; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #dcd66e; text-decoration: none; float: none; padding-top: 52px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }.left { margin: 0px; float: left; height: 820px; width: 153px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 60px; overflow:hidden; } .left_menu_area { margin: 0px; padding: 0px; float: right; height: 320px; width: 153px; } .left_menutop { background-image: url(images/menu_top.png); background-repeat: no-repeat; margin: 0px; padding: 0px; float: left; height: 1px; width: 153px; } .left_menu { font-family: Arial; font-size: 11px; font-weight: bold; font-variant: normal; color: #386060; text-decoration: none; background-image: url(images/menu_active.png); background-repeat: no-repeat; margin: 0px; float: left; height: 20px; width: 138px; padding-top: 5px; padding-right: 15px; padding-bottom: 0px; padding-left: 0px; } .left_menu:HOVER { font-family: Arial; font-size: 11px; font-weight: bold; font-variant: normal; color: #da2a2a; text-decoration: none; background-image: url(images/menu_hover.png); background-repeat: no-repeat; margin: 0px; float: left; height: 20px; width: 138px; padding-top: 5px; padding-right: 15px; padding-bottom: 0px; padding-left: 0px; }.comment_head { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; background-image: url(images/comments.png); background-repeat: no-repeat; margin: 0px; float: left; width: 130px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 23px; background-position: 20px 8px; } .comments_area { margin: 0px; padding: 0px; float: left; width: 150px; } .comments_text { font-family: Arial; font-size: 11px; font-weight: bold; color: #386060; text-decoration: none; margin: 0px; float: left; width: 153px; padding-top: 0px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; } .comments_link { font-family: Arial; font-size: 10px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: underline; } .comments_link:hover { font-family: Arial; font-size: 10px; font-weight: normal; text-transform: none; color: #386060; text-decoration: underline; } .Services_head { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; background-image: url(images/services.png); background-repeat: no-repeat; float: left; width: 130px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 23px; background-position: 45px 8px; margin-top: 20px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } .midarea { margin: 0px; float: left; height: 820px; width: 543px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 40px; } .head { font-family: Georgia; font-size: 15px; font-weight: normal; color: #d0910b; text-decoration: none; margin: 0px; float: left; width: 540px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } .body_textarea { font-family: Arial; font-size: 14px; font-weight: normal; color: #3c6f75; text-decoration: none; margin: 0px; float: left; width: 500px; padding-top: 0px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; } .readmore { font-family: Arial; font-size: 11px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-image: url(images/readmore.png); background-repeat: no-repeat; margin: 0px; float: right; height: 18px; width: 74px; padding-top: 4px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .readmore:hover { font-family: Arial; font-size: 11px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-image: url(images/readmore1.png); background-repeat: no-repeat; margin: 0px; float: right; height: 18px; width: 74px; padding-top: 4px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }.innerbanner { font-family: Arial; font-size: 18px; font-weight: normal; color: #8a8a8a; text-decoration: none; background-image: url(images/innerbanner.jpg); background-repeat: no-repeat; margin: 0px; height: 60px; width: 508px; padding-top: 457px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .innerbanner_head { font-family: Arial; font-size: 18px; font-weight: normal; color: #8a8a8a; text-decoration: none; background-image: url(images/tickmark.png); background-repeat: no-repeat; margin: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 20px; background-position: 0px 4px; } .right { margin: 0px; padding: 0px; float: left; height: 820px; width: 170px; } .events_head { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; background-image: url(images/events.png); background-repeat: no-repeat; float: left; width: 135px; padding-top: 2px; padding-right: 0px; padding-bottom: 20px; padding-left: 35px; margin: 0px; } .login_area { margin: 0px; float: left; width: 150px; padding-top: 0px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; } .login_top { background-image: url(images/login_01.png); background-repeat: no-repeat; margin: 0px; padding: 0px; float: left; height: 5px; width: 146px; } .login_bottom { background-image: url(images/login_03.png); background-repeat: no-repeat; margin: 0px; padding: 0px; float: left; height: 5px; width: 146px; } .login_bodyarea { margin: 0px; float: left; width: 140px; padding-top: 0px; padding-right: 0px; padding-bottom: 10px; padding-left: 6px; background-attachment: scroll; background-image: url(images/login_02.png); background-repeat: repeat-y; } .right_head { font-family: Arial; font-size: 11px; font-weight: normal; color: #FFFFFF; text-decoration: none; margin: 0px; float: left; height: 17px; width: 131px; padding-top: 3px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; background-image: url(images/right_head.png); background-repeat: no-repeat; } .right_textbox{ font-family: Arial; font-size: 11px; font-weight: normal; color: #FFFFFF; text-decoration: none; margin: 0px; float: left; height: 17px; width: 131px; padding-top: 3px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; } .right_text{ font-family: Arial; font-size: 11px; font-weight: bold; color: #d5ca89; text-decoration: none; margin: 0px; float: left; height: 17px; width: 131px; padding-top: 3px; padding-right: 0px; padding-bottom: 10px; padding-left: 0px; } .righttextbox { font-family: Arial; font-size: 10px; font-weight: normal; color: #000000; text-decoration: none; margin: 0px; padding: 0px; float: left; height: 18px; width: 128px; border: 1px solid #999999; } .righttextbox:hover { font-family: Arial; font-size: 10px; font-weight: normal; color: #000000; text-decoration: none; margin: 0px; padding: 0px; float: left; height: 18px; width: 128px; border: 1px solid #333333; } .login { font-family: Arial; font-size: 10px; font-weight: normal; color: #070808; text-decoration: none; background-image: url(images/login_button.png); background-repeat: no-repeat; float: right; height: 18px; width: 48px; margin-top: 0px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; padding-top: 3px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .login:hover { font-family: Arial; font-size: 10px; font-weight: normal; color: #070808; text-decoration: none; background-image: url(images/login_button1.png); background-repeat: no-repeat; float: right; height: 18px; width: 48px; margin-top: 0px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; padding-top: 3px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .newletter_head { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; background-image: url(images/newlinks.png); background-repeat: no-repeat; float: left; width: 135px; padding-top: 2px; padding-right: 0px; padding-bottom: 20px; padding-left: 25px; margin: 0px; background-position: 0px 3px; } .news_link { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: underline; } .news_link:hover { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #386060; text-decoration: underline; } /*------------------------------------------------fotter--------------------*/ #fotter{ width:100%; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; float: left; font-family: "Trebuchet MS"; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color: #c5a873; text-decoration: none; padding: 0px; height: 123px; background-image: url(images/fotter.jpg); background-repeat: repeat-x; background-position: top; background-attachment: scroll; } .fotter_links { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; margin: 0px; float: left; height: 20px; width: 100%; color: #202219; padding-top: 15px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .fotter_text { font-family: Arial; font-size: 12px; font-weight: normal; color: #cb0002; text-decoration: none; margin: 0px; float: left; height: 43px; width: 944px; padding-top: 53px; padding-right: 30px; padding-bottom: 32px; padding-left: 30px; } .fotter_copyrights { font-family: "Trebuchet MS"; font-size: 10px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; margin: 0px; float: left; height: 20px; width: 100%; color: #b17a04; padding-top: 5px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; } .fotter_validation { font-family: "Trebuchet MS"; font-size: 9px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; margin: 0px; float: left; height: 20px; width: 100%; color: #c75c2c; padding-top: 5px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } /*------------------------------------------------fotterlinks --------------------*/ a.fotterlink:link { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; color: #202219; padding-right: 5px; padding-left: 5px; } a.fotterlink:visited { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; color: #202219; padding-right: 5px; padding-left: 5px; } a.fotterlink:hover { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; color: #b17a04; padding-right: 5px; padding-left: 5px; } a.fotterlink:active{ font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; text-decoration: none; color: #202219; padding-right: 5px; padding-left: 5px; } /*------------------------------------------------fotterlinksend--------------------*/ /*------------------------------------------------validation --------------------*/ a.xhtml:link { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #d0910b; margin: 0px; clear: none; float: none; height: 20px; width: 150px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 10px; } a.xhtml:visited { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #d0910b; margin: 0px; clear: none; float: none; height: 20px; width: 150px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 10px; } a.xhtml:hover { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #386060; margin: 0px; clear: none; float: none; height: 20px; width: 150px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 10px; } a.xhtml:active{ color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #d0910b; margin: 0px; clear: none; float: none; height: 20px; width: 150px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 10px; } a.css:link { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #386060; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; } a.css:visited { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #386060; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; } a.css:hover { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #d0910b; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; } a.css:active{ color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #386060; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; } .fotter_designed { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; text-decoration: none; margin: 0px; float: left; height: 20px; width: 100%; color: #3e8f96; padding-top: 15px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } /*------------------------------------------------validation--------------------*/ .fotter_designedlink { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; text-decoration: none; color: #1d6369; } .fotter_designedlink:hover { font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; text-decoration: none; color: #b17a04; } /*-------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ #innercontentblank { margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 40px; } #innerhedding { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } #innercontent { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #innercontent002 { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #innercontent003 { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #innercontent004 { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #innercontent005 { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #submenuhedding { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } #submenublank { margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } #submenutop { margin: 0px; float: left; width: 433px; height:1px; padding:0px; background-image: url(images/topline.jpg); background-repeat:no-repeat; } .submenu { margin: 0px; float: left; width: 410px; height:17px; padding:2px 0 0 23px; font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; background-image: url(images/active.png); background-repeat:no-repeat; } .submenu:hover { margin: 0px; float: left; width: 410px; height:17px; padding:2px 0 0 23px; font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; background-image: url(images/over.jpg); background-repeat:no-repeat; } /*-------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*----------------------------------------------------------------contactpage----------------------------------------------------------------------------------------*/ #contactblank { margin: 0px; float: left; width: 674px; padding-top: 40px; padding-right: 30px; padding-bottom: 0px; padding-left: 30px; } #contactinnerblank { width:1004px; height:500px; float:left; margin:0px; padding:0px; } #contactheddingblank { width:500px; height:30px; float:left; margin:27px 0 0 45px; padding:0px; font:normal 12px/17px Arial, Helvetica, sans-serif; color:#CECECE; border-bottom: solid 1px #7f7f7f; } #contactaddressblank{ margin: 0px; padding:0 0 0 30px; float: left; width:236px; font-family: "Trebuchet MS"; font-size: 11px; font-weight: normal; color: #000000; text-decoration: none; } #contactaddresshedding { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } #contactaddresstext{ font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; text-align:justify; } #contactsmallhedding { font-family: Arial; font-size: 11px; font-weight: bold; color: #386060; text-decoration: none; margin: 0px; float: left; width: 700px; padding:0 0 10px 0; } #contacthedding { font-family: Georgia; font-size: 22px; font-weight: normal; text-transform: none; color: #d0910b; text-decoration: none; margin: 0px; float: left; width: 750px; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; padding-left: 0px; } #contacticon{ width:86px; height:84px; float:left; background-image: url(contacticon.png); background-repeat:no-repeat; margin:10px 0 0 30px; } #contactfeildnameblank { width:160px; height:400px; margin:10px 0 0 0; padding:0; float:left; } #contactfeildblank { width:200px; height:400px; margin:10px 0 0 0; padding:0; float:left; } #contactfeildname { width:160px; height:20px; margin:0px; padding:0; float:left; } #contactfeildname002 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname003 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname004 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname005 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname006 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname007 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname008 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeildname009 { width:150px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild { width:200px; height:20px; margin:0px; padding:0; float:left; } #contactfeild002 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild003 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild004 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild005 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild006 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild007 { width:200px; height:20px; margin:5px 0 0 0; padding:0; float:left; } #contactfeild008 { width:200px; height:20px; margin:8px 0 0 0; padding:0; float:left; } #contactfeild009 { width:200px; height:60px; margin:5px 0 0 0; padding:0; float:left; } #submitbutton { width:200px; height:20px; margin:60px 0 0 0; padding:0; float:left; text-align: left; } .contactfeildname { font-family: Arial; font-size: 11px; font-weight: normal; text-transform: none; color: #9ca27e; text-decoration: none; } .contactfeild { font-family:Arial, Helvetica, sans-serif; font-size:10pt; color: #3c4538; border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; height:20px; } .contactfeild { font-family:Arial, Helvetica, sans-serif; font-size:10pt; color:#3c4538; border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; height:20px; } .submitbutton { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #386060; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; cursor:pointer; } .submitbutton:hover { color: #FFFFFF; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; background-color: #d0910b; margin: 0px; padding: 0px; clear: none; float: none; height: 20px; width: 100px; border: 1px dotted #FFFFFF; padding-top: 0px; padding-right: 20px; padding-bottom: 0px; padding-left: 20px; cursor:pointer; } .contactinput { border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; } .contactinput:hover { border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; } .listbox { width:174px; height:20px; border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; } .listbox:hover { width:174px; height:20px; border:solid; border-width:1px; border-color:#d2e3e9; background-color:#fffdfd; } /*----------------------------------------------------------------contactpage----------------------------------------------------------------------------------------*/

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Maison en bois</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="form1" name="form1" method="post" action=""> <div id="topheader"> <div class="logo"></div> <div class="menu_area"><a href="#" class="ideas">Maison bois <span class="menu_text"></span></a> <a href="#" class="links">Madriers Rondins <span class="menu_text"></span></a> <a href="#" class="info">Ossature Cristal <span class="menu_text">Maecenas</span></a> <a href="#" class="works">Poteau poutre <span class="menu_text">Maecenas</span></a></div> </div> <div id="search_strip"> <div class="freeregistration"> </div> <div class="search_area"> <div class="search_box"> <label> <input name="textfield" type="text" class="searchtextbox" /> </label> </div> <div class="search_go"> <div align="center"><a href="#" class="go">GO</a></div> </div> <div class="search_box">&raquo; <a href="#" class="advancesearch">Advance Search</a></div> </div> </div> <div id="body_area"> <div class="left"> <div class="left_menutop"></div> <div class="left_menu_area"> <div align="right"><a href="#" class="left_menu">Maison bois</a><br /> <a href="#" class="left_menu"> Maison Madriers</a><br /> <a href="#" class="left_menu">Maison Rondins</a><br /> <a href="#" class="left_menu">Maison Ossature Bois</a><br /> <a href="#" class="left_menu">Maison de Cristal</a><br /> <a href="#" class="left_menu">Vos projets, devis</a><br /> <a href="#" class="left_menu">News letter</a><br /> <a href="#" class="left_menu">Atouts du Bois</a><br /> <a href="#" class="left_menu">Ecologie</a><br /> <a href="#" class="left_menu">Contact</a></div> </div> <div class="comments_area"> <div class="comment_head"> <div align="right">Livre d'or</div> </div> <div class="comments_text"> <div align="right">Clients satisfaits <br /> <a href="#" class="comments_link">Vos maisons bois en images</a></div> </div> <div class="comments_text"> <div align="right">At leo at elitconsequat <br /> <a href="#" class="comments_link">uctus pellentesque et erat nec </a></div> </div> <div class="comments_text"> <div align="right">Vestibulum vepusl <br /> <a href="#" class="comments_link">vamus et magna et torpraesent accumsan</a></div> </div></div> <div class="comments_area"> <div class="Services_head"> <div align="right">Services</div> </div> <div class="comments_text"> <div align="right">Justo praesent <br /> <a href="#" class="comments_link">ourna tempus imperdiet llentes Pellentesque</a></div> </div> <div class="comments_text"> <div align="right">At leo at elitconsequat <br /> <a href="#" class="comments_link">uctus pellentesque et erat nec </a></div> </div> <div class="comments_text"> <div align="right">Vestibulum vepusl <br /> <a href="#" class="comments_link">vamus et magna et torpraesent accumsan</a></div> </div> <div class="comments_text"> <div align="right">Justo praesent <br /> <a href="#" class="comments_link">ourna tempus imperdiet llentes Pellentesque</a></div> </div></div> </div> <div class="midarea"> <div class="head"><h1>Maison bois</h1> </div> <div class="body_textarea"> <div align="justify">These templates are licensed under a Creative Commons Attribution 2.5 License.</div> </div> <a href="http://www.maison-bois.name/maison-bois.htm"><img src="images/maison-bois.jpg" border="0" /></a> <a href="http://www.maison-en-bois.name/maison-en-bois.htm"><img src="images/maison-en-bois.jpg" border="0" /></a> <a href="http://www.maison-bois.name/chalet.htm"><img src="images/chalet.jpg" border="0" /></a> <a href="http://www.maison-bois.name/petite-maison-bois.htm"><img src="images/petite-maison-bois.jpg" border="0" /></a> <a href="http://www.maison-en-bois.name/maison-madriers.htm"><img src="images/maison-madriers.jpg" border="0" /></a> <a href="http://www.maison-en-bois.name/chalet-bois.htm"><img src="images/chalet-bois.gif" border="0" /></a> <a href="http://www.maison-en-bois.name/maison-en-rondins.htm"><img src="images/maison-en-rondins.gif" border="0" /></a> <a href="http://www.maison-en-bois.name/maison-de-cristal.htm"><img src="images/maison-de-cristal.jpg" border="0" /></a> <div class="body_textarea"> <div align="justify">These templates are licensed under a Creative Commons Attribution 2.5 License.</div> </div> <div class="body_textarea"> <div align="justify"> <p>temper is a free, tableless, W3C-compliant web design layout by Template World. This template has been tested and proven compatible with all major browser environments and operating systems. You are free to modify the design to suit your tastes in any way you like.</p> <p>We only ask you to not remove "Design by Template World" and the link http://www.templateworld.com from the footer of the template.</p> </div> </div> <div class="body_textarea"> <div align="center"><a href="#" class="readmore">Read More </a></div> </div> <div class="innerbanner"><span class="innerbanner_head">Blandit ultricies urna velit congue ligula sed vulputate urna </span><br /> <span class="innerbanner_head">Turpis eu tortor ut quis quam</span></div> </div> <div class="right"> <div class="comments_area"> <div class="events_head">Events</div> <div class="comments_text"> <div align="left">On 12th January 2008 <br /> <a href="#" class="comments_link">ourna tempus imperdiet llentes Pellentesque</a></div> </div> <div class="comments_text"> <div align="left">On 14th January 2008 <br /> <a href="#" class="comments_link">uctus pellentesque et erat nec </a></div> </div> <div class="comments_text"> <div align="left">On 16th January 2008 <br /> <a href="#" class="comments_link">vamus et magna et torpraesent accumsan</a></div> </div> </div> <div class="login_area"> <div class="login_top"></div> <div class="login_bodyarea"> <div class="right_head"> <div align="center">Join Us For Membership</div> </div> <div class="right_textbox"> <label> <input name="textfield2" type="text" class="righttextbox" value="Name" /> </label> </div> <div class="right_textbox"> <label> <input name="textfield22" type="password" class="righttextbox" value="Password" /> </label> </div> <div class="right_text"> <label> <input type="checkbox" name="checkbox" value="checkbox" /> </label> Remember Me</div> <div class="right_text"> <div align="center"><a href="#" class="login">Login</a></div> </div> </div> <div class="login_bottom"></div> </div> <div class="login_area"> <div class="login_top"></div> <div class="login_bodyarea"> <div class="right_head"> <div align="center"><strong>Newsletter Signup </strong></div> </div> <div class="right_textbox"> <label> <input name="textfield23" type="text" class="righttextbox" value="Email Id" /> </label> </div> <div class="right_text"> <div align="center"><a href="#" class="login">Signup</a></div> </div> </div> <div class="login_bottom"></div> </div> <div class="comments_area"> <div class="newletter_head">Partenaires</div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Sed massa Integer tincidunt </a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Dapibus nunc</a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Phasellus ac Nunc</a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Quisque rhoncus felis in </a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Ultricies sollicitudin diam orci </a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Mollis risusin rhoncus velit </a></div> </div> <div class="comments_text"> <div align="left"><a href="#" class="news_link">Nulla ege</a></div> </div> </div> </div> </div> <div id="fotter"> <div class="fotter_links"> <div align="center"><a href="#" class="fotterlink">Home</a> | <a href="#" class="fotterlink">About Us</a> | <a href="#" class="fotterlink">Companies Success</a> | <a href="#" class="fotterlink">Client Testimonials</a> | <a href="#" class="fotterlink">Methods of Development</a> | <a href="#" class="fotterlink">Newsletter</a> | <a href="#" class="fotterlink">Subscribe Info</a> | <a href="#" class="fotterlink">Oppotunities</a> | <a href="#" class="fotterlink">Current Events</a> | <a href="#" class="fotterlink">Contact Us</a></div> </div> <div class="fotter_copyrights"> <div align="center">&copy; Copyright Information Goes Here. All Rights Reserved</div> </div> <div class="fotter_validation"> <div align="center"><a href="http://validator.w3.org/check?uri=referer" target="_blank" class="xhtml">XHTML</a> <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank" class="css">CSS</a><br /> </div> </div> <div class="fotter_designed"> <div align="center">Designed By : <a href="#" class="fotter_designedlink">Template World</a></div> </div> </div> </form> </body> </html>
[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]

par Stef » 04 janv. 2009, 19:51

T'es pas nul, t'es juste en train d'apprendre c'est pas pareil... :wink:

montre la partie html stp!

ainsi que ton fichier css!

pour l'idée, tu peux essayer ça:

Code : Tout sélectionner

.spacer { clear: both; }
et tu l'intègres dans ton html, avant ton footer, comme ceci:

Code : Tout sélectionner

<div class="spacer"></div> <div [footer]> .... </div>

par patrick777 » 04 janv. 2009, 19:44

En fait, je suis vraiment nul nul, on m'a dit de faire cela avant le footer:

Code : Tout sélectionner

.clean { width:largeur du site; height:1px; clear:both; }
Mais cela n'a rien resolu,

J'ai fait pareil au debut de mon footer, mais toujours rien...

[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]

par Stef » 04 janv. 2009, 18:23

Bonjour,

peut-ête qu'un "clear: both;" dans les propriétés css de ton footer résoudra-t-il ton problème...

à essayer...

probleme css avec mon footer

par patrick777 » 04 janv. 2009, 18:14

Bonjour,
J'ai un soiucis avec mon site: www.maison-bois.name sous Internet explorer, tout est ok, mon footer s'adapte a ma page, si je met beaucoup de photos et de texte dans mon text area, le footer descend et s'adapte sous internet explorer, mais sous firefox, il reste fixe et mon text area, photos glisse en dessous pour finir dssous le footer.

Je ne sais pas comment resoudre ce probleme, quelqu'un pourrait il m'aider?

Patrick

[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]