28173 sujets

CSS et mise en forme, CSS3

bonjour je debut en css et j'ai un probleme

j'ai créé un header

#header {
	top: 0 px;
	left: 0 px;
	height: 8em;
	font-size: 1em;
	background: url(./images/logo.gif) bottom left no-repeat;
	padding: 0;
	margin: 0;
	text-align:right;
	padding-right:1em;
}
moi texte est aligné a droite mais j'aimerais qu'il soit aussi placé en bas (vertical align ? bottom ?)

je pense que quelqu'un peu m'aider ! Merci d'avance
Modifié par valentin85 (08 Dec 2006 - 14:41)
Bonjour,

Avant toute chose, peux-tu éditer ton message afin de formatter ton code comme demandé dans la FAQ?

Ensuite, il me semble que ton problème est plus un problème de fond que d'une réelle difficulté passagère. Ton header, par exemple, n'a aucune raison de bénéficier des attributs top et left puisqu'il n'est pas sorti du flux par un positionnement relatif ou absolu.

Pour résoudre ton problème, il y a évidemment plusieurs solutions, comme positionner ton texte grâce à une position relative, ou encore pousser ce dernier avec un padding-top.
merci mais le fait de faire un padding top pause un problème car si j'agrandis les caractères (CTRL + '+' sous fx) cela crée un espace de plus en plus important !

upload/9863-pbcss.jpg

le problème pourrait être peut être résolu si l'image ne se décollait pas du top
Modifié par valentin85 (07 Dec 2006 - 17:23)
Salut,

Un truc comme ça:

<style type="text/css">
*{margin:0; padding: 0;}

#header {
	position: relative;
	top: 50px;
	left: 100px;
	border:1px solid black;
	height: 8em;
	width: 10em;
	font-size: 1em;
	background: url(./images/logo.gif) bottom left no-repeat;

}

#header p{
	position: absolute;
	bottom: 0;
	right: 0;

}
		</style>
</head>
<body>

<div id="header">
	<p> coucou, suis là !!</p>
</div>

</body>