Forum Développeur - Administration serveur, programmation et base de données

Forum Développeur - Administration serveur, programmation et base de données > Programmation > xHTML et CSS

toonboy

Jul 15 2005, 09:34 AM

Bonjour à tous,

Je suis confronté à un petit problème...

Comment arriver à ce resultat: http://php.studiopress.be/testTom/divcentree/
sans tableaux.

VERSION TABLEAUX:
css:

Code

table#header{ width:100%; height:92px;
border:0px; margin:0px; padding:0px
}

td#header_left{ width:50%; height:92px;
border:0px; margin:0px; padding:0px;
background-color:#B73D1A
}

td#header_right{width:50%; height:92px;
border:0px; margin:0px; padding:0px;
background-color:#D47849
}

html:

Code

TEST VERSION DIV

css:

Code

.c_header_repeat{width:100%;
}

.c_header_repeat_left{float:left;width:10%;
height:92px; margin:0px;
padding:0px; background-color:#B73D1A;
}

.c_header_center{float:left; width:750px;
height:92px; margin:0px; padding:0px;
background-color:#B73D1A
}

.c_header_repeat_right{float:right;width:10%;
height:92px; margin:0px;
padding:0px; background-color:#D47849
}

html:

Code

Mais avec ce code, dès que la page est trop petit pour afficher les 10% de droite
ma div saute en dessous... et dès que c'est plus grand des écart se formee entre les div.

Le problème c'est que ma div centrale à une taille bien définie (750px) et que ma div de gauche de droite doivent s'étendre respectivement vers la gauche et vers la droite.

Comment faire ?

Merci d'avance.

krek

Jul 16 2005, 08:33 AM

Je n'ai pas compris

J'ai CC ton code et cela ne ressemble
nullement au visuel que tu nous soumets.

Bref, j'ai fait ça d'après le visuel :

Code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

</style>
</head>

<body>
<div class="haut"></div>
<div class="div_001"></div>
<div class="div_002"></div>
<div class="div_003"></div>
</body>
</html>

Je ne sais pas si c'est bien ce que tu voulais faire pask c'est vraiment simple ..
Quelque-chose à du m'échapper comme d'hab ...

toonboy

Jul 18 2005, 08:44 AM

ben c pas trop ça au fait...
comme tu dis ça c simple

merci quand même

le truc c'est que ma têtiere est composé de 3 parties...

* une à gauche (fond rouge-orangé)
* mon image de 750px
* une à droite (fond orange)

personne d'autres n'a une solution ?

toonboy

Jul 18 2005, 08:46 AM

Le visuel soumis est bien entendu la version tableau

krek

Jul 18 2005, 12:15 PM

Et si tu rajoutes ces 2 blocs dans le haut ?

Code

.gauche {
width : 100px;
height : 100px;
background-color : #333;
position : absolute;
left : 0}
.droite {
width : 100px;
height : 100px;
background-color : #333;
position : absolute;
right : 0}

toonboy

Jul 22 2005, 11:44 AM

nop hélas ...

Le problème c'est que comme ça les div ont une taille définie ...
Ce que j'aimerais c'est qu'elles s'étendent simultanément suivant la taille de la fenêtre ...

merci quand même

Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'informations, la mise en page et les images, veuillez cliquer ici.