5568 sujets

Sémantique web et HTML

Problème positionement absolut et réslution d'écran

bonjour à tous,
je suis entrain d'intégrer ma maquette avec css, et je suis tombé sur un problème de positionnement droit qui se décale au changement de la résolution d'ecran, je débute en css et je sais pas coment faire!!
voilà mon code css:


div#recherche{
	position:absolute;
	top:96px;
	left:804px;
	width:189px;
	height:30px;
	background:url(images/header_09.jpg) no-repeat;
}


merci
Salut,

Pour constater un peu plus précisément ton problème et être en mesure de t'aider, il serait bien que tu nous fournisses dans l'idéal une page en ligne, ou au moins l'intégralité de ton code, et/ou des images explicatives si nécessaire, comme le recommande la règle 13 du forum. Smiley cligne
En l'état, j'ai peur qu'il ne soit difficile de t'apporter une solution.
je peux pas publier la page en ligne, mais voilà out mon code:
css:


@charset "utf-8";
/* CSS Document */
body {
	margin: 0px 0 ;
	padding: 0 ;
	text-align: center ;
	background:url(images/bg.jpg) repeat-x #003674;
	}
div#conteneur2{
	width:983px;
	margin: 0 auto;
	padding: 0 6px 0 6px;
	text-align: left ;
	border: 0px;
}
div#conteneur{
	width:983px;
	background:#fff;
	margin: 0 auto;
	padding:0;
	text-align: left ;
	border: 0px;
}
div#header{
background:url(images/accueil_02.jpg) no-repeat;
width:971px;
height:128px;
}
div#recherche{
	position:absolute;
	top:96px;
	left:804px;
	width:189px;
	height:30px;
	background:url(images/header_09.jpg) no-repeat;
}
div#conteur{
position:relative;
top:104px;
left:180px;
width:240px;
height:24px;
background:url(images/conteur.jpg) no-repeat;}
div#anglais{
background:url(images/header_03.jpg) no-repeat;
height:23px;
width:22px;
position:relative;
top:67px;
left:745px;

}
div#arabe{
background:url(images/header_06.jpg) no-repeat;
height:23px;
width:16px;
position:relative;
top:67px;
left:645px;
}
div#franc{
background:url(images/header_08.jpg) no-repeat;
width:36px;
height:16px;
position:relative;
top:67px;
left:745px;
}



et 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>
<link rel="stylesheet" href="styles.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>

<body>
<div id="conteneur">
<div id="conteneur2">
<div id="header">

<div id="conteur"></div>
<div id="anglais"></div>
<div id="franc"></div>
<div id="arabe"></div>
<div id="recherche"></div>

</div>
</div>
</div>
</body>
</html>
Bonjour,

Sais-tu que l'on peut positionner un élément en absolu par rapport à son plus proche parent positionné en absolu ou en relatif? Ben maintenant tu le sais. Donc:
#header {position: relative;}
et j'ai une autre question, l'absolu par rapport à son parent, le parent, c'est le div qui se trouve avant ou bien celui qui le contient ???
sarahdev a écrit :
et j'ai une autre question, l'absolu par rapport à son parent, le parent, c'est le div qui se trouve avant ou bien celui qui le contient ???

A ton avis? Smiley cligne Celui qui le contient bien-sûr. Sinon c'est une div soeur.
Qu'est ce qui bloque à présent?
ça marche maintenant, merci, quand j'ai mis position:relative au div header, mais en fait je t'avoue que j'ai pas saisie e principe du relative et absolue et quand est ce que je dois mettre l'un ou l'autre Smiley confus
Sujet clos
Aller à