Structure d'un site

Résolu/Fermé
kyuubi6 - 2 juin 2011 à 17:21
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 - 2 juin 2011 à 20:58
Bonjour,

je suis entrain de faire un site pour un ami et comme d'habitude je galère sur la structure du site :s
j'aimerais qu'il y ai sa bannière, en dessous le menu, en dessous un bloc contenant du text à droite et à gauche des image défilente puis enfin le pied de page.
Voici mon code :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html>

<head>
<title>Troupe</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/design.css" type="text/css" media="screen" />

</head>

<body>
<div id="global">
	<div id="banniere"></div>
	<br/>
	<div id="menu">
		<img src="menu.png" style="width:32px;height:33px;" /><a href="index.php">Troupe</a>&nbsp;
		<img src="menu.png" style="width:32px;height:33px;" /><a href="sarah.php">Sarah</a>&nbsp;
		<img src="menu.png" style="width:32px;height:33px;" /><a href="menu_galery.php">Galerie</a>&nbsp;
		<img src="menu.png" style="width:32px;height:33px;" /><a href="formulaire.php">Demande de prix</a>&nbsp;
		<img src="menu.png" style="width:32px;height:33px;" /><a href="contact.php">Contact</a>&nbsp;
	</div>
	<div id="contenu">
		<!--Voir si je fais deux div a l'intérieur avec image défile et le texte-->
		<div id="contenu_texte">
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sed mauris vitae lorem vulputate ornare. Praesent at lacus augue, ut ornare lectus. Etiam nulla nunc, feugiat ut tincidunt eget, auctor eu sapien. Donec ac malesuada metus. Donec lacinia tincidunt est non sagittis. Mauris nunc lectus, tincidunt eget condimentum vitae, iaculis non eros. Morbi sit amet purus eu mi molestie sodales quis ornare eros. Sed sagittis commodo cursus. Fusce accumsan, lectus et porta pulvinar, arcu nisi consequat elit, at faucibus metus mi eget erat. Ut vitae velit dolor. Integer facilisis volutpat lectus ac interdum. Mauris non nibh quis diam aliquam iaculis a vitae urna. Ut ac vestibulum risus. Nunc vitae arcu lorem. Nunc ullamcorper porttitor pretium. Suspendisse auctor pellentesque justo non euismod.</p>

<p>Ut porta ultricies posuere. Aliquam erat volutpat. Aenean pharetra facilisis lectus vitae imperdiet. Donec sed placerat erat. Nunc eget ante neque, a bibendum mauris. Maecenas ornare leo eu purus tristique dignissim. Mauris sit amet sem at urna rutrum sagittis eu nec libero. Donec gravida vulputate justo a sodales. Pellentesque elementum cursus tortor, sed rhoncus erat varius luctus. In nunc neque, bibendum pellentesque sollicitudin quis, malesuada vel arcu. Cras nec eros non elit ultricies placerat at nec tellus. Nam sapien turpis, faucibus ac venenatis vitae, malesuada eget lacus. Proin hendrerit vehicula felis ut convallis. Proin malesuada leo ac est dapibus sed iaculis orci mattis. Fusce at justo nec ipsum aliquam posuere. Donec nec aliquam orci. Sed vitae lorem sed tellus porta tempus. Nulla facilisi.</p>

<p>Sed tincidunt, ante in blandit accumsan, dolor nunc rutrum erat, eget venenatis nisl nibh et nulla. Morbi sit amet neque eu est blandit scelerisque cursus ac dolor. Aenean enim ligula, tempor ac tincidunt at, venenatis quis libero. Suspendisse luctus blandit ligula, ac blandit purus porttitor a. Donec purus odio, venenatis eu sodales sit amet, aliquam id nibh. Proin viverra magna vitae tellus placerat et mollis dui pellentesque. Nulla tristique, felis id auctor lacinia, leo orci euismod est, et adipiscing neque turpis non lectus. Nunc sed auctor lacus. Vestibulum convallis, tellus eget ultricies commodo, felis lacus lobortis nibh, quis bibendum quam ligula vitae elit. Phasellus purus elit, tempus eget sollicitudin quis, facilisis at nunc. Donec eget tortor at diam posuere malesuada nec nec felis. Maecenas eu augue sit amet augue pulvinar vestibulum. Phasellus mi sem, tempor id convallis nec, sollicitudin et dolor. Sed in rhoncus tortor. <p>
		</div>
		<div id="contenu_image">
		image défilente a venir
		</div>
	</div>
	<div id="pied"><p>Sarah Logan Copyright</p></div>
</div>

</body>

</html>

Mon souci est que le pied de page "suit" le div id contenu_image mais logiquement il devrait suivre le div contenu donc être en dessous de mon text :s

merci de votre aide

A voir également:

4 réponses

kevin76110 Messages postés 4273 Date d'inscription vendredi 14 août 2009 Statut Membre Dernière intervention 27 mars 2013 872
2 juin 2011 à 17:27
'lut,

Externalise ton style dans un style.css
C'est 100 fois plus propre.
0
euh je ne comprends pas, mon css est à part mise à part pour les images du menu que j'ai oublié lol
0
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
2 juin 2011 à 18:48
Pour avoir les deux bloc côte à cote, tu utilises je suppose la propriété CSS float.
Pour le pied, il suffit d'utiliser la propriété clear avec la valeur both.
Le bloc viendra en dessous des deux autres normalement si c'est bien fait.
div#pied{clear:both;}

Toutefois, je ne pourrai t'en dire plus que quand j'aurai vu ton code CSS.

Tu peux sinon regarder ces gabarits: http://www.alsacreations.com/static/gabarits/
0
kevin76110 Messages postés 4273 Date d'inscription vendredi 14 août 2009 Statut Membre Dernière intervention 27 mars 2013 872
2 juin 2011 à 18:46
style="width:32px;height:33px tu pourrais l'externaliser.
Externalise aussi ton menu et ton footer.
0
merci avec le clear:both ca fonctionne très bien :)
encore merci
0
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
2 juin 2011 à 20:58
Pas de problème.
Content d'avoir pu t'aider.
0