28173 sujets

CSS et mise en forme, CSS3

[Résolu] Problème espacement entre 2 Div

Bonjour,

Problème #1 -> Régler

C'est pas tout à fait un problème mais plutot une question. J'ai un espacement entre 2 div que j'ai corrigé avec "margin-bottom:-6px;" sur la div "header". Cependant, j'ai aucune idée t'où vient cette espacement et j'aimerai bien savoir si j'ai fais quelques de mal dans ma structure html ou css.

Problème #2

Aussi, j'ai un problème avec un lien avec firefox-IE. Les états liens semblent marchés correctement avant le premier "click" mais des qu'on clique, on dirait que le lien reste toujours à l'état "link" même si on le survole. Le mailto fonctionne très bien mais le href cause problème.

<li>
<a href="http://www.pascalandreallaire.com/contenu/cv/cv.html">CV</a>
</li>


voici l'exemple : http://www.pascalandreallaire.com/index2.html

html

<!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>
<title> Index - Portfolio de Pascal-André Allaire -  www.pascalandreallaire.com  </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" lang="fr" content="Pascal-Andre Allaire" />
<meta name="Publisher" content="Pascal-Andre Allaire" />
<meta name="Reply-to" content="allaire.pascalandre@hotmail.com (Pascal-Andre Allaire)" />
<meta name="Description" content="CV de Pascal-Andre Allaire" />
<meta name="Keywords" content="Pascal-Andre Allaire, cv Allaire, Allaire cv, Allaire, Allaire portfolio, Allaire" />
<meta name="Indentifier-URL" content="www.pascalandreallaire.com" />
<meta name="Robots" content="Index, Follow" />
<meta name="Revisit-after" content="15" />
<style type="text/css" media="screen">
<!--
@import url("css/index2.css");
-->
</style>
</head>

<body>
<div id="container">
		<div id="header">&nbsp;</div>
		
		<div id="content">
			<h2>Contenu</h2>
			<p>bla bla bla</p>
					<ul>
						<li>Pascal-Andr&eacute; Allaire</li>

						<li><a href="mailto:allaire.pascalandre@hotmail.com">allaire.pascalandre@hotmail.com</a></li>
						<li>2222</li>
						<li>3333</li>
						<li><a href="http://www.pascalandreallaire.com/contenu/cv/cv.html">CV</a></li>
					</ul>
		</div>
		
		<div id="footer">&nbsp;</div>

	</div>
</body>
</html>


CSS
body

{

	padding:0px;

	margin-left: 0px;

	margin-bottom: 0px;

	margin-right: 0px;

	margin-top: 0px;

	background-color:#799A97;

	font-size:100%;

	font-family:Verdana, Arial, Helvetica, sans-serif;

}



#container

{

	position: relative; /* on positionne le conteneur */

    margin-left: auto;

    margin-right: auto;

    width:564px;

    text-align: left;

	margin-top:10px;

	background-color:#3366FF;



}



#header

{

	width:564px;

	height:150px;

	padding:0px;

	margin:0px;

	/*margin-bottom:-6px;*/ ligne de code qui corrige le problème #1

	background-image:url(../img/index/header_index.gif);

	background-color:#3366FF;

}



#content

{

	padding:0px;

	margin:0px;

	background-image:url(../img/index/contenu_index.gif);

	background-repeat:repeat;

	width:564px;

	height:auto;

}



	#content h2

	{

		font-size:0.8em;

		padding-top:5px;

		padding-left:60px;

		margin: 0px;



		

	}



	#content p

	{

		font-size:0.7em;

		padding-left:60px;

		padding-right:60px;

		text-align:left;

		margin: 0px;



	}

	

	#content ul 

	{

		margin:0px;

		padding:0px;

	}

	

		#content ul li

		{

			font-size:0.7em;

			padding-left:60px;

			text-decoration:none;

			list-style-type:none;

			text-align:left;

		}

	

	#content h3

	{

		font-family:Arial, Helvetica, sans-serifl;

		font-size:0.7em;

		text-align:center;

		margin: 0px;

	}



#footer

{

	width:564px;

	height:16px;

	background-image:url(../img/index/footer_index.gif);	

}



	

	

/****** Classe modification texte ******/





/************* Lien  **************/



#content a:link

{

	text-decoration:none;

	color:#666;

}



#content a:hover

{

	color:#999;

	text-decoration:underline

}





#content a:visited

{

	color:#666;

	text-decoration:none;

}

Modifié par Sgtcook (12 May 2007 - 01:05)
Bonjour,

Ton image de fond fait 144px de haut (background-repeat par défaut) et ton header 150px de haut de là peut être le problème ??
C'était bien ça, quel honte Smiley confused , je m'étais basé sur mon ancienne version "header" qui faisait 150 px.

Merci !

Pour ce qui est du problème avec le lien, IE le fait aussi.
Modifié par Sgtcook (11 May 2007 - 02:13)
Mise à jour

Problème #1 -> Régler

Problème #2

Aussi, j'ai un problème avec un lien avec firefox-IE. Les états liens semblent marchés correctement avant le premier "click" mais des qu'on clique, on dirait que le lien reste toujours à l'état "link" même si on le survole. Le mailto fonctionne très bien mais le href cause problème.

<li>
<a href="http://www.pascalandreallaire.com/contenu/cv/cv.html">CV</a>
</li>


voici l'exemple : http://www.pascalandreallaire.com/index2.html
ghost a écrit :
Re,

Il y a un ordre à respecter : link, visited, hover, vérifie si c'est ok


C'était en plein ça, on apprend à chaque jour Smiley cligne
Sujet clos
Aller à