18041 sujets

Questions générales et questions de débutants

Problème de structure HTML

Pages :
Bonsoir, je n'etait pas sure ou le poster j'hésitait entre css et html donc je le post ici.

Voilà mon problème:

Je voulais faire un design extensible en largeur et en hauteur pour certaine partie la hauteur(le corps).

Seulement problème,je veut mettre un pied de page que j'ai nomé fond pour la div mais j'aimerais que quand le webmaster(terme générale) tape sont texte et que le texte est trop grand c'est à dire quand on commence à voire la barre de schrool(deso pour l'hortographe ma mèmoire est assez courte pour ça) sur le coté que le pied de page dessende avec,essayer avec une position absolue(sur le pied de page) faudrais dire que, celle si ne dessend pas avec Smiley sweatdrop , j'ai essayer de l'imbriquer avec le corps mais les width:100% ne prennent plus effet enfain elle sont stopper par la largeur du corps, je trouve aps de solution Smiley bawling Smiley bawling .

Voici mon site ou je fait mes test :

www.taurilius.net/test02/index.html

code html:

<html xmls="http://www.w3.org/1999/xhtml" xml:lang="fr" >
     <head>
	       <title>Exemple d'utilisation de CSS externe</title>
		   <meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
            <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
	    </head>
		<body>
		
		<!---Logo--->
		<div id="logo">
		</div>
		<!--- le menu--->
		<div id="menu">
		</div>
		
		<!-- le header-->
	<div id="header">
	</div>
	
<!-- Corps-->
	<div id="corps"><br /> prq on me voit pas?<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></p>	
    </div>
	
	<!---le fond----->
		<div id="fond">
		</div>
	 
		</body>


je sait c'est un peut bordelique il faut me comprendre c'est juste pour m'entrainer xD

Code css:

body
{
background: url("images/bg.gif");
font-size: 0.8em;
font-family: Verdana, Arial, serif;
margin:0px;
}

#menu
{
width:100%;
background:url("images/fond_menu.png");
height:30px;

}
#corps
{
width:600px;
background-color:white;
position:absolute;
right:210px;
}


#fond
{
width:100%;
height:100%;
background-color:red;

}


Merci de votre futur aide Smiley rolleyes Smiley cligne
Modifié par taurilius (04 Jul 2007 - 12:16)
connecté
Modérateur
Salut,

C'est quoi la question déjà ? Smiley sweatdrop Peux tu être plus explicite svp ? Également, donne un meilleur titre à ton sujet, svp.

++
Modifié par Nolem (04 Jul 2007 - 00:33)
Enfaite j'ai pas trouvé mieux car c'est belle et bien un problème de structure si j'avais voulu mettre un titre mieux j'aurais un titre de 60 mots, mon problème pour résumé:

Le dernier bloc qui se nome : fond ne veut pas dessendre quand j'écrit beaucoups de texte dans le bloc "corps", pourtant il devrait dessendre en même temps vu que c'est un design extensible largeur + hauteur.
Modifié par taurilius (04 Jul 2007 - 10:10)
Salut,

Pourrais-tu faire un effort sur l'orthographe et la lisibilité de tes messages car comme tu le sais, la vocation de ce forum est d'être accessible à tous... même aux personnes qui suivent ton sujet à l'aide d'une synthèse vocale.

Merci d'avance d'éditer tes messages pour les corriger, et d'être attentif à la rédaction des futurs messages.
Bonjour,

Dans ton exemple :
- tu n'as pas de balise </html> ;
- tu as un commentaire mal formé, et qui n'est donc pas interprété comme tel (il s'affiche dans le navigateur comme un contenu texte) ;
- div#fond est vide ;
- le texte «prq on me voit pas?» se voit très bien ;
- div#corps est positionné bizarrement (si le but était de centrer ce bloc : virer le positionnement absolu, et utiliser les marges automatiques).

Au sujet de ton titre, « Problème de structure HTML » aurait été plus explicite que « structure aide ».
Tout d'abord merci de votre aide, grâce à vous j'ai pu régler la majorité de mes erreurs.

Mais y a encore une chose que je ne comprends pas:

j'ai mis cette balise suivante dans le css pour le corps :

-height: 100%;

Je pensait que le corps descendrais directement et prennent la totalité de la fenêtre en hauteur, suivant la résolution d'écran de la personne qui visiterais la page.

Merci de votre aide
Modifié par taurilius (04 Jul 2007 - 12:30)
taurilius a écrit :
j'ai mis cette balise suivante dans le css pour le corps :

-height: 100%;

Je pensait que le corps descendrais directement et prennent la totalité de la fenêtre en hauteur, suivant la résolution d'écran de la personne qui visiterais la page.

Eh ben non, ça marche pas comme ça. Smiley biggrin

La FAQ traite déjà de ce sujet, mais voici une petite ressource complémentaire (ignorer la partie sur le pied de page) :
http://web.covertprestige.info/test/16-page-sur-toute-la-hauteur-et-pied-de-page-1.html
Me revoilà encore,je vait bientôt y arriver, enfin j'espére.
J'ai une question maitenant:

-Ou je place cette élément :

<!--[ if lte IE 6]>
<style type="text/css">
div#page {
	height: 100%;
}	
</style>
<![ endif]-->


Dans le fichier .css ou .html?

J'ai vu que sa commençais avec des balises </style> donc je le placerais dans le html mais je ne sait pas ou?
Modifié par Igor (04 Jul 2007 - 18:03)
Sa répond partiellement à ma question.

Car je ne sait pas ou le placer a part dans un fichier (X)html

je dois le mettre comme ceci?

<!-- Corps-->
<!--[if lte IE 6]>
<style type="text/css">
div#page {
	height: 100%;
}	
</style>
<![endif]-->
	<div id="corps"></div>


Ou alors comme celà?


	<div id="corps"><!-- Corps-->
<!--[if lte IE 6]>
<style type="text/css">
div#page {
	height: 100%;
}	
</style>
<![endif]-->

</div>


Enfaite je veut juste savoir si l'odre a une importence, si je dois le placer avant ma div(corps), dedans ou après
Modifié par taurilius (04 Jul 2007 - 22:18)
taurilius a écrit :
Enfaite je veut juste savoir si l'odre a une importence

Non, car toutes les solutions que tu envisages sont fausses. Smiley cligne

Prenons les choses par le menu. Qu'est-ce que tu as dans le code suivant :
<!--[if lte IE 6]>
<style type="text/css">
...
</style>
<![ endif]-->
?

Tu as :
- un commentaire HTML (syntaxe <!--contenu du commentaire-->), qui peut donc se placer n'importe où dans un document HTML (de préférence pas avant le Doctype, par contre) ;
- un élément HTML style et son contenu.

La réponse est donc : tu peux mettre ce code à n'importe quel endroit où tu as le droit de mettre un élément style.

C'est à dire uniquement dans le head, et de préférence après tous les autres appels à des feuilles de styles.


PS : pense à utiliser les balises [ code] et [ /code] (sans les espaces après le crochet ouvrant) pour mettre en forme tes messages, lorsque tu postes du code. Smiley cligne
Modifié par Florent V. (04 Jul 2007 - 20:59)
@taurilius: merci de présenter lisiblement ton code avec les balises ad hoc [ code] et [ /code] (sans espace).
taurilius a écrit :
je comprend plus rien j'arrete le html c'est pas pour moi Smiley sweatdrop


Faut pas se décourager si vite Smiley smile .

Comme dans beaucoup de domaines, il faut passer par une phase d'apprentissage qui est primordiale. Sinon faire appel à des outils de gestion et de production de contenu, ou des professionnels.

Personnellement j'y connais rien en mécanique auto, je fais confiance aux professionnels du secteur et me débrouille tout seul pour faire la vidange, au delà je n'ai pas de compétences ni l'envie de les acquérir. C'est un exemple Smiley cligne .
J'ai commencer plus tôt que je l'avais dit car je suis un peut plus motivé,
Voilà le resultat:

http://www.taurilius.net/test02/

j'ai encore un dernier soucis, mon pied de page qui est un bloc de couleur rouge ne prend pas toute la largeur de la page je suppose que c'est du faite qu'il soit l'enfant de la div corps, si je ferme la div corps un problème apparaît, le bloc corps prend toute la hauteur et meme et peut trop je vais dire, il depasse le pied de page et c'est pas ce que je veut ,je sait pas comment faire Smiley rolleyes .
Hello,

Pas vu de pied de page dans ton code source.

Par ailleurs, tu as toujours ton problème avec ton commentaire HTML mal formé :
<!---le fond----->

Il faudrait écrire :
<!-- le fond -->
merci de l'info,je corrige sa le plus vite possible, pour le pied de page c'est cette div la:

<!-- le fond -->
		<div id="[#red]fond[/#]">
		</div>
		
	 
	 </div>
		</body>

Modifié par taurilius (06 Jul 2007 - 17:16)
Pages :
Sujet clos
Aller à