28173 sujets

CSS et mise en forme, CSS3

salut, j'ai presque fini un site avec les css tout en étant débutant. Un de mes rares problèmes est l'affichage en hauteur. Sous IE6, mon texte du milieu colle à la bannière du haut, tandis que sous Firefox, il y a un espace assez important. J'ai jonglé avec les margin, les padding,etc...en vain
Je me demande aussi quel DOCTYPE et CHARSET je dois utliser. Voici le mien:


<!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" />



Voici ma feuille css créée sous Dreamweaver 8:


* CSS Document */



body {
        position: absolute;
	margin: 0px;
	margin-left:0px;
	padding: 0px;
	width: 100%;
	height: 100%;
	font-family: verdana, arial, sans-serif;
	font-size: 12px;

}

div#haut {
	width: auto;
	height: 50px;
	background-color: White;
	color: #fff;
	font-size: 36px;
	
}


div#menu {
	position: absolute;
	left: 24px;
	width: 107px;
	height: 450px;
	margin-top: 130px;
	top: 27px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
		
}

div#frame {
	margin-top: 140px;
	margin-left: 140px; /* on place ce bloc à droite du bloc menu de     180px de large */
	width: 890px;
	height:auto;
   	overflow: auto;  cette propriété va permettre le scroll de ce bloc 
	font-size: 14px;
	padding: 15px;
	padding-top: 0px;
	font-family: Arial, Helvetica, sans-serif;
	border-left:dotted thin;
	
}

div#bas { 
  
	width: 1024px;
	height: 30px;
	padding: 0 ;
	text-align: center ;
}


	

</style>

autre chose: le code CSS pour la bannière du bas est le suivant est ici dessous. Mais la bannière remonte dans le texte et s'y superpose quand le texte dépasse la bannière. Comment faire pour que la banniière du bas suive le texte, c.à.d. que celle-ci s'affiche en bas du texte quelque soit la hauteur de ce dernier.



div#bas { 
  
	width: 1024px;
	height: 30px;
	padding: 0 ;
	text-align: center ;
}

Merci de me conseiller. a+
Modifié par midiweb (27 Jan 2007 - 10:49)
Bonsoir,

body positionné en absolu, voilà qui est singulier... Smiley sweatdrop

Pour le doctype, sa syntaxe semble correcte, et dans la mesure où il correspond à tes besoins il sera approprié. Même remarque pour le charset : si l'encodage déclaré correspond bien à l'encodage réel du texte, tout va bien (note : si ce dernier point n'est pas clair, lire ceci).

midiweb a écrit :
Mais la bannière remonte dans le texte et s'y superpose quand le texte dépasse la bannière.

C'est peut-être l'heure tardive, mais j'ai du mal à visualiser ça...
Au vu de ton code, il semblerait que ton pied de page peut poser problème dans le cas où le menu positionné en absolu serait plus long que le bloc de contenu principal. Mais ça serait plus clair avec une capture d'écran, ou mieux encore : une page de test en ligne !

Pour finir, j'aimerais souligner que donner une largeur de 1024px à un élément n'est pas très malin. Il suffit de réduire la fenêtre du navigateur à pile 1024px pour se rendre compte du problème que cela pose : si la fenêtre du navigateur a une largeur de pile 1024px, à combien se réduit la largeur disponible pour le contenu ?
Sans oublier qu'il vaut mieux prendre large, car les utilisateurs ne maximisent pas forcément la fenêtre du navigateur... 980px est une bonne largeur de référence (si on part du principe que l'on se fiche des 10-15% d'utilisateurs en 800x600, bien sûr).
salut, je m'excuse si je n'ai pas respecté la charte mais c'est bien malgré moi. Quand je peux, je mets les balises code. Il se peut que j'aie oublié de les mettre au début de l'inscription sur le forum. Je ne peux pas réediter certains de mes messages pour insérer ces balises code. Je ferai dorénavant plus attention. Mille excuses encore. Salutations à tous.
midiweb a écrit :
salut, je m'excuse si je n'ai pas respecté la charte mais c'est bien malgré moi. Quand je peux, je mets les balises code. Il se peut que j'aie oublié de les mettre au début de l'inscription sur le forum. Je ne peux pas réediter certains de mes messages pour insérer ces balises code. Je ferai dorénavant plus attention. Mille excuses encore. Salutations à tous.
Tu as oublié de les mettre quasiment systématiquement, alors qu'à chaque fois un modérateur te le faisait remarquer. Vu comme ça, ça ressemble plus à du mépris qu'à un oubli.

D'autre part, tu peux très bien éditer tes messages pour les modifier (c'est d'ailleurs dans les règles du forum...), sauf quand le sujet a été fermé. D'ailleurs, Raphaël te l'avait déjà fait remarquer...

Merci donc de le faire rapidement et de lire (relire ?) les règles du forum. Smiley smile
salut, non, pas du "mépris" loin de moi ce sentiment. Je considère au contraire votre site avec beaucoup d'admiration. Il se peut que j'aie envoyé des messages dans la hâte à partir de mon travail. Je travaille en Allemagne et donc je jongle un peu entre les deux langues.
J'avais aussi insérer <code> au lieu de [code]. Je viens d'ailleurs de corriger un message. A+