28172 sujets

CSS et mise en forme, CSS3

Positonnement absolute

Bonjour,

J'essaie de comprendre le CSS, j'ai voulu faire des positions absolus pour mais cela ne marche pas.
C'est un example que j'ai trouvé et un peu modifier pour comprendre.

Je n'arrive pas à faire en sorte que ma colonne 3 soit collé à droite.
Et que la colonne 2 prenne toute la largeur.

Feuille CSS

html {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	}
body {
	margin: 0px;
	padding: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 0.9em;
	height: 100%;
	width: 100%;
	background-image: url(water.png);
	background-repeat: repeat-x;
	background-position: top;
	background-color: #F0ECD6;
	border: solid 2px red; 
	}


#container {
	width: 700px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	z-index: 4;
	position: relative;
	border: solid 10px black; 
	}
#intro {
	margin-top: 0px;
	padding-top: 130px;
	border: solid 8px pink; 
	}
#pageHeader h1 {
	/*background-image: url(title.png);*/
	height: 195px;
	width: 290px;
	background-repeat: no-repeat;
	margin-top: 0px;
	position: absolute;
	border: solid 2px grey; 
	}
	
#pageHeader h11 {
	/*background-image: url(title.png);*/
	height: 195px;
	background-repeat: no-repeat;
	margin-top: 0px;
	margin-left: 294px;
	position: relative;
	border: solid 2px grey; 
	}
	
#pageHeader h111 {
	/*background-image: url(title.png);*/
	height: 195px;
	width: 290px;
	background-repeat: no-repeat;
	top: 0px;
	right: 1%;
	position: absolute;
	border: solid 2px grey; 
	}
	

#pageHeader {
	z-index: 5;
	margin-top: -130px;
	position: absolute;
	 
}


Code html 


<body id="css-zen-garden">

<div id="container">
	<div id="intro">
		<div id="pageHeader">
			<h1><span>colonne H1</span></h1>
			<h11><span>colonne H2</span></h11>
				<h111><span>colonne H3</span></h111>
			<h2><span>The Beauty of <acronym title="Cascading Style Sheets">CSS</acronym> Design</span></h2>
		</div>
	</div>


</div>

</body>
</html>


Merci pour votre aide
Hello,

Avant de comprendre CSS, il faut commencer par comprendre HTML. En HTML, on ne peut pas inventer des éléments. Je ne peux pas inventer l'élément truc qui se coderait ainsi:
<truc>Bla bla.</truc>

Comme l'élément truc n'existe pas, il est fort probable que les navigateurs web l'ignoreront tout simplement.

De même, tu ne peux pas inventer les éléments HTML h11 et h111. Ça ne marchera pas.

Hop:
http://css.alsacreations.com/Comment-debuter-et-trouver-l-information

Bonne continuation. Smiley smile
Sujet clos
Aller à