Design extensible

Fermé
mister-gwada97one Messages postés 110 Date d'inscription samedi 23 août 2008 Statut Membre Dernière intervention 1 janvier 2012 - 28 nov. 2009 à 20:04
mister-gwada97one Messages postés 110 Date d'inscription samedi 23 août 2008 Statut Membre Dernière intervention 1 janvier 2012 - 29 nov. 2009 à 01:29
Salut!
Avec un ami, on a créé un design, mais il n'est pas bien codé.
Regardez ici: http://imagik.fr/view-rl/169642
A gauche et à droite ne sont pas extensibles, et le footer se place mal. Je crois que tout viens du css.

Quelqu'un peut m'aider svp ? Merci d'avance.


Cordialement, Kévin

4 réponses

avion-f16 Messages postés 19249 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 15 juin 2024 4 504
28 nov. 2009 à 20:10
Comment veux-tu qu'on t'aider si on n'a pas le code ?
Le plus simple serait de le mettre en ligne.
Je penses que tu devrais ajouter “<div style="clear:both;"></div>” avant de fermer le div qui contient tout.
0
mister-gwada97one Messages postés 110 Date d'inscription samedi 23 août 2008 Statut Membre Dernière intervention 1 janvier 2012 7
29 nov. 2009 à 00:21
Voici la partie body:
<body>
<!-- Header --->
<a href="#"><div id="header"></div></a>
<div id="connexion"></div> 
<div id="cadre">
<div id="menu_gauche">
  <p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Transitional" width="88" height="31" border="0" align="middle" /></a>
  </p>
</div>
<div id="news">
  <p>Texte</p>
</div>
<div id="inscription">
</div>
<!-- Fin Header --->

<div id="barre"></div>
<div id="barre_gauche">

<p>Texte</p>
</div>

<div id="fond_texte"><div id="texte">

<p style="margin-bottom:6px;margin-left:6px;color:#000;">
Texte ici<br />
<br />
<br />
Excogitatum est super his, ut homines quidam ignoti, vilitate ipsa parum cavendi ad colligendos rumores per Antiochiae latera cuncta destinarentur relaturi quae audirent. hi peragranter et dissimulanter honoratorum circulis adsistendo pervadendoque divites domus egentium habitu quicquid noscere poterant vel audire latenter intromissi per posticas in regiam nuntiabant, id observantes conspiratione concordi, ut fingerent quaedam et cognita duplicarent in peius, laudes vero supprimerent Caesaris, quas invitis conpluribus formido malorum inpendentium exprimebat.
<br />
<br />
Primi igitur omnium statuuntur Epigonus et Eusebius ob nominum gentilitatem oppressi. praediximus enim Montium sub ipso vivendi termino his vocabulis appellatos fabricarum culpasse tribunos ut adminicula futurae molitioni pollicitos.
Isdem diebus Apollinaris Domitiani gener, paulo ante agens palatii Caesaris curam, ad Mesopotamiam missus a socero per militares numeros immodice scrutabatur, an quaedam altiora meditantis iam Galli secreta susceperint scripta, qui conpertis Antiochiae gestis per minorem Armeniam lapsus Constantinopolim petit exindeque per protectores retractus artissime tenebatur.
<br />
<br />
Illud autem non dubitatur quod cum esset aliquando virtutum omnium domicilium Roma, ingenuos advenas plerique nobilium, ut Homerici bacarum suavitate Lotophagi, humanitatis multiformibus officiis retentabant.
<br />
<br />
Tu autem, Fanni, quod mihi tantum tribui dicis quantum ego nec adgnosco nec postulo, facis amice; sed, ut mihi videris, non recte iudicas de Catone; aut enim nemo, quod quidem magis credo, aut si quisquam, ille sapiens fuit. Quo modo, ut alia omittam, mortem filii tulit! memineram Paulum, videram Galum, sed hi in pueris, Cato in perfecto et spectato viro.
<br />
<br />
</p>

</div><div id="texte_bas"></div></div>
<!-- Footer --->
<div id="footer"><p style="text-align:center;color:#FFF;">
Footer
</p></div>

</div>  
</body>


Et le CSS:
	body {
	background-color: #ace4e8;
	color: #000000;
	background-image:url(images/index_01.gif);
	background-repeat:repeat-x;
	font-size:13px;
	font-family:Estrangelo Edessa;
}
	
	div#header {
	background-image:url(images/header.gif);
	background-repeat: no-repeat;
	width: 737px;
	height: 213px;
	padding: 0;
	position:absolute;
	left:0px;
	top:1px;
	}
div#connexion {
	background-image:url(images/index_06.gif);
	background-repeat:no-repeat;
	position:absolute;
	width: 125px;
	height: 19px;
	padding: 0;
	left: 736px;
	top: 194px;
	}
  
div#cadre {
	background-image:url(images/cadre.png);
	background-repeat:no-repeat;
	position:relative;
	width: 970px;
	height: 939px;
	padding: 0;
	left: 200px;
	top: 206px;
	float:inherit;
	float:left;
	
	}
	
div#menu_gauche {
	background-image:url(images/Menu_gauche.gif);
	background-repeat:no-repeat;
	width: 183px;
	height: 164px;
	position:absolute;
	left: 11px;
	top: 10px;
	border-bottom-color:#000;
	text-align: left;
	

}
	
div#barre_gauche {
	background-image:url(images/barre01_gauche.gif);
	background-repeat:no-repeat;
	background-color:#007385;
	width: 183px;
	min-height:665px;
	position:relative;
	left: 11px;
	top: 218px;
	text-align: left;
	float:left;
	height: 589px;
	

}

	
div#fond_texte {
	background-image:url(images/fond_body.gif);
	background-repeat:no-repeat;
	background-color:#64c9d8;
	min-height::678px;
	width: 766px;
	position:absolute;
	left: 194px;
	top: 218px;
	border-bottom-color:#000;
	text-align: left;
	margin-left: auto;
	margin:auto;
	float:left;
	height: 665px;

}
	
div#texte {
	background-image:url(images/texte.gif);
	background-repeat:no-repeat;
	background-color:#FFF;
	width: 737px;
	min-height:554px;
	position:relative;
	left: 15px;
	top: 15px;
	border-bottom-color:#000;
	text-align: left;
	color:#000;
	float:left;

}

#p {
	margin-bottom:6px;
	margin-left:6px;
	color:#000;
	}
	
div#texte_bas {
	background-image:url(images/texte_bas.gif);
	width: 737px;
	height: 16px;
	position:relative;
	left: 15px;
	top: 10px;
	border-bottom-color:#000;
	clear:left;
	}

#footer {
	background-image:url(images/footer.gif);
	position:relative;
	width:969px;
	height:37px;
	clear:both;
	left: 0px;
	top: 916px;
}
	
	div#news {
	background-image:url(images/News_milieu.gif);
	position:absolute;
	width:558px;
	height:164px;
	left: 206px;
	top: 10px;
	}
	
	div#inscription {
	background-image:url(images/inscription_droite.gif);
	position:absolute;
	width:183px;
	height:164px;
	top:10px;
	left: 775px;
	}
	
div#barre {
	background-image:url(images/barre.gif);
	position:absolute;
	width:969px;
	height:34px;
	top:178px;
	left:0px;
	}

p {
	margin-bottom:6px;
	margin-left:6px;
	color:#FFFFFF;
	margin-right:6px;
}
0
avion-f16 Messages postés 19249 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 15 juin 2024 4 504
29 nov. 2009 à 01:08
Ça ne sert à rien de dire que ton site est valide si ce n'est pas le cas ...
Ton code ne ressemble à rien, il est illisible !
Inspires-toi de ces mises en page.
0
mister-gwada97one Messages postés 110 Date d'inscription samedi 23 août 2008 Statut Membre Dernière intervention 1 janvier 2012 7
29 nov. 2009 à 01:29
Ok, merci =)
0