28172 sujets

CSS et mise en forme, CSS3

Bonjour,
j'ai un donc une ébauche de page avec 3 bouton, et donc 3 liens.
Le problème est que le lien du dernier bouton (contact) rempli toute la page, les balises sont pourtant fermés.

J'ai quelques difficultés avec les "div." et div#" peut etre que le probleme vient de là.


Voici les fichiers html & css :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
<head> 

	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 
	<meta name="description" content="Nom du site" /> 
	<meta name="keywords" content="Mots clés" /> 
	<meta name="robots" content="all" />

	<title>Titre de page</title> 
 
	
	<style type="text/css" title="currentStyle" media="screen"> 
		@import "page.css";
	</style> 	
 
</head>
	<body>
		<div id="header">
			<div id="h_left">
				Set image-text for title
			</div>
			<div id="h_right">
				Set image-text about the page...
			</div>
			<div id="h_relief">
			</div>
		</div>
		
		<div id="center">
			<div id="c_left">
				<div class="linklist"><a href="portfolio.htm"><img src="img/port.png"</a> </div>
				<div class="linklist"><a href="blog.htm"><img src="img/blog.png"</a> </div>
				<div class="linklist"><a href="contact.htm"><img src="img/cont.png"</a> </div>
			</div>
			<div id="c_right">
			</div>
		</div>
		
		<div id="footer">
			<div id="f_left">
			</div>
			<div id="f_right">
			</div>
		</div>
		
	</body> 
</html>





html{
	margin:0;
	padding:0;
}

body{
	background-color:#000000;
	height:100%;
	margin:0;
	padding:0;
}

/* ==================== HEADER ==================== */

div#header {
	position:relative;
	width: 100%;
	height:76px;
}

div#h_left { /*header*/
	float:left;
	width:300px;
	height:100%;
	background-color:#92a012;
}

div#h_right { /*header*/
	width:100%;
	height:100%;
	background-color:#92a012;
}

div#h_relief { /*header*/
	background-image:url(img/h_relief.png);
	position:absolute;
	margin-top:0px;
	width: 100%;
	height:15px;
}

/* ==================== CENTER ==================== */

div#center {
	width:100%;
	padding:0;
	height:480px;
}

div#c_left { /*center*/
	padding-top:40px;
	float:left;
	width:340px;
	height:440px;
	background-color:#000000;
}

div#c_right { /*center*/
	width:100%;
	height:100%;
	background-color:#272f07;
}

div.linklist img{
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
	padding-left:40px;
	margin-top:-5px;
	opacity:0.75;
}

div.linklist a:hover img {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
	padding-left:48px;
	opacity:1.00;
}

/* ==================== FOOTER ==================== */

div#footer {
	width:100%;
	padding:0;
	height:300px;
}

div#f_left { /*footer*/
	float:left;
	width:300px;
	height:100%;
	background-color:#0b0f03;
}
div#f_right { /*footer*/
	width:100%;
	height:100%;
	background-color:#0b0f03;
}

Modifié par lithiumsound (04 Mar 2012 - 12:42)