Probleme avec la position absolute

par **niuxe** » 03 août 2009, 03:35

Hello,

Moi même, je ne comprends pas bien. Peux tu faire une capture d'écran/dessin de ce que tu veux faire, stp ? Comme ton code a des petits soucis, j'entrevoie quand même la solution. Toutefois, je peux me tromper et faire fausse route.

Au plaisir de te lire.

par **ironx** » 02 août 2009, 18:42

Salut ,
Tu veux obtenir quoi exactement?
N'oublie pas que l'ordre d'appel des div est aussi importante

par **Nad21** » 17 juin 2009, 17:42

Bonjour
voilà j'ai un soucis que j'essai de resoudre depuis plusieurs jours et dont je ne trouve pas la reponse
Comme le cas est un peu complexe je prefere mettre le code et un dessin du resultat final que je souhaiterais et qui n'est pas ce que j'obtient sur un ecran 22 pouce
Le div photo et completement à droite quand au div=ruban je n'arrive pas a le remonter (il disparait)
Merci de votre aide je cale

Code : Tout sélectionner

<body class="home">
<div id="menu">  <ul> 
        <li>1 * </li> 
        <li><a href="#">2</a> * </li> 
        <li><a href="#">3</a> * </li> 
        <li><a href="#">4</a></li> 
        </ul> </div>
 <div id="photo"></div>
<div id="container" class="home">
  <h1 id="logo"></h1>

  <div id="header" class="home">
    <div class="ruban"><img src="images/ruban.png" width="980" height="233" /></div>
    <div class="texte" id="texte">texte<div>
      </div>
</div>
</body>

le css

Code : Tout sélectionner


a{
color: #100E07;}

body.home {
	text-align: center;
	background-color: #B6A987;
	background-image: url(../images/fond.jpg);
	background-repeat: no-repeat;
	background-position: center ;
}
body {
	background: #B6A987 ;
	text-align: center;
	font: Georgia, "Times New Roman", Times, serif;	
}
h1#logo {
	display: block;
	width: 320px;
	height: 160px;
	background: url(../images/logo.png) no-repeat;
	text-indent: -9999px;
	margin-top: 35px;
	margin-left: 35px;

}

#container {
	width: 980px;
	margin: 0 auto;
	text-align: left;
	position: relative;
}
#container.home {
	background: none;
}
#header {
	height: 225px;
	position: relative;
	text-align: center !important;
	width: 980px;	
}
#header.home {
	height: 340px;
	position: relative;
	width: 980px;
	overflow: hidden;
}

#menu { 
	display: block;
	width: 980px;
	height: 22px;
	margin-left: 10px;
	margin-top: 25px;
	margin-bottom:20px;
	font-size: 21px;
	color: #FFFFFF;
	text-align:left;
}
#menu ul { padding:0; margin:0; list-style:none; }
#menu ul li { display:inline; text-decoration:none; }
#menu ul li a {
	color: #302A1C;
	text-decoration:underline;
}
#menu ul li a:hover {
	text-decoration:none;
}

#photo{
	width: 284px;
	height: 188px;
	background: url(../images/sable.png) no-repeat;
	position: absolute;
	z-index: 2;
	top: 20px;
	right: 20px;

}
.ruban {
	width: 980px;
	height: 245px;
	position: absolute;
	z-index: 3;
	left: 0px;
	background: url(../images/ruban.png) no-repeat;
}

.texte {
	width: 470px;
	height: 200px;
	position: absolute;
	z-index: 4;
	top: 80px;
	right: 85px;
	font-size: 12px;
	color: #100E07;
	text-align: justify;
	font-family: Georgia, "Times New Roman", Times, serif;
}

Probleme avec la position absolute

Répondre

Étendre la vue Revue du sujet : Probleme avec la position absolute

Re: Probleme avec la position absolute

Re: Probleme avec la position absolute

Probleme avec la position absolute