Longueur d'une div selon une autre

**Seta-san** · 26/06/2007, 21h43

Bonsoir !

Je voudrais adapter la longueur d'une div selon le contenu d'une autre mais je ne sais comment faire.

Voici un petit schéma :

////////////// /////////
/ Contenu / / Menu /
/ . . . . . . / / . . . . /
/ . . . . . . / /////////
/ . . . . . . /
/ . . . . . . /
//////////////

Je veux faire en sorte que le menu prenne la longueur du contenu.
Auriez vous une petite idée ?

Merci pour votre aide !

(ps : je ne veux pas faire de tableaux)

**Seta-san** · 27/06/2007, 11h47

C'est bon j'ai trouvé.

J'avais mal dispersé les héritages et j'avais un div enveloppeur en trop.
Donc du coup :

td : 100%
contenu : hinerit
Menu : hinerit

C'était bête, mais c'est ce genre de problèmes les plus énervant. ^^

**Seta-san** · 28/06/2007, 19h40

C'est encore moi !

Je me suis rendu compte que j'avais oublié d'introduire un doctype a mon document et donc j'ai rencontrer des problèmes d'affichages selon le navigateur utilisé.

Apres avoir mis mon doctype, l'affichage est redevenu correct sauf que la taille de mes div ne fonctionne plus en "inherite".

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Je ne comprend plus..

Le code (allégé) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
...<td valign="top" style="height:100%;... ">
      <div style="height:inherit"... >
              <!--php-->
          <div style="height: inherit; float:right;...">
                <!--php-->
              <div style="height: inherit; float:left;...">
                  <!--php-->
              </div>
          </div>
      </div>

Ca me gonfle ^^
help !!

**Dan_A** · 28/06/2007, 21h04

Pas de tableau ? Il me semble pourtant que c'est dans un tableau.
Vouloir reproduire le comportement d'un tableau avec des divisions est souvent source de problèmes.
Une solution ici : http://www.alistapart.com/articles/fauxcolumns/

**Seta-san** · 29/06/2007, 20h59

Merci pour ton lien, mais ca ne marche pas pour moi.
Mes div son bien dans un tableaux.

Voici ma page de test :

/Lien supp/

Le but est que la ligne vertical s'étende jusqu'en bas.

**Dan_A** · 30/06/2007, 10h57

La source que j'ai citée marche, mais malheureusement la bordure n'ira pas jusqu'en bas dans tous les cas (même en utilisant une mise en page avec des cellules de tableau) à cause de l'image avec les coins arrondis.
Si le contenu est toujours plus important que le menu on peut mettre une bordure à droite du contenu au lieu d'à gauche du menu.
Par ailleurs, il vaut mieux que son modèle utilise de l'html valide :
http://validator.w3.org/check?verbos...iture_musicale

**Seta-san** · 30/06/2007, 15h38

Ca fonctionne presque ! Il fallait mettre le div en absolute.
Mon code est par la même occasion valide.

Le div s'étend bien, mais a une longueur fixe.
Même si il n'y a rien dans la page.

Page vide

j'espère vraiment que tu pourras m'aider.

Merci encore !

**Dan_A** · 30/06/2007, 17h27

Je ne comprends pas l'intérêt d'utiliser position:absolute. Le code précédent était plus facile à modifier.
L'affichage n'est plus du tout compatible avec IE 6 et IE 7.
Il faut mettre du contenu pour effectuer les tests.
Il faut mettre les styles dans la feuille de style ou dans la partie head, pas dans l'html pour pour corriger plus facilement.

**Kerod** · 30/06/2007, 19h43

Pourquoi tu ne mets pas directement la bordure au bloc de gauche ? Ainsi ça prendra toute la page vu que c'est le contenu de gauche qui fixe la hauteur ?

Et comme Dan le disait, pourquoi mettre un absolute pour celui de droite ?

**Seta-san** · 30/06/2007, 21h10

Dan > c'est ce qu'il dise sur le lien que tu m'a passer. Il faut que la div soit en absolute. Ca ne marche pas si je le met pas ainsi. Etrange

Kerod > Oui j'ai pensé à mettre la bordure sur le cadre de gauche, mais je veux trouver la solution pour éviter de retomber un jour sur le meme soucis.
Ca m'intrigue ^^ Mais si vraiment je ne trouve pas, et bien je n'aurai pas le choix.

Ha, j'avais pas fait attention a la compatibilité ie. :s

**Seta-san** · 01/07/2007, 20h47

N'ayant pas trouvé de solution j'ai mis mon style au cadre de gauche. Tempis.

Merci à vous deux !

Longueur d'une div selon une autre

CSS

Discussions similaires

Partager

Partager