Forum Programmation.web des DIV dans un DIV

Posté par  .
Étiquettes : aucune
0
27
juin
2005
Bonjour,
j'ai un probleme de CSS, un truc que je ne comprends pas là.
J'ai un div qui englobe d'autres div.
voici mon CSS :


.ligne { border : 1px solid #9370DB;

	    margin : 1px;

	    background-color : #FFFAF0; }

.item { float:left;

        position:relative;

       width:100px; }

et voici mon html : (j'ai mis des [] pour les tags)
[div class='ligne'][div class='item']aaa[/div][div class='item']bbb[/div][/div]

bon, je pensais que le div general allait englober les 2 div à l'interieur, mais pas du tout. le div du dessus (avec la bordure de 1px) est tout "plat".

comment lui dire de s'ajuster au contenu (les div qui sont dedans) ??

merci

  • # float: left

    Posté par  . Évalué à 2.

    le float: left sort le div interieur du "flux normal" cf : http://openweb.eu.org/articles/initiation_float/(...)

    Dam

    • [^] # Re: float: left

      Posté par  . Évalué à 2.

      mais alors comment je fais si je veux que mes div (item) soit les uns a coté des autres ? (car si je sort le float hé ben ils vont être les uns en dessous des autres)

      merci d'avance

      • [^] # Re: float: left

        Posté par  . Évalué à 1.

        Essai l'attribut "display" qui permet de spécifier comment un élement s'insère dans le flux du document (en gros, si l'élement provoque ou non un saut de page avant ou après lui).

        Voir http://openweb.eu.org/articles/initiation_display/(...) pour plus d'infos.

        .item {
        /*float:left;*/
        position:relative;
        width:100px;
        display: inline; }

        Testé dans IE6 et dans FF :-)

        A+,
        Jay

        • [^] # Re: float: left

          Posté par  . Évalué à 2.

          ouais, ca marche bien, mais dans ce cas, je perd l'usage des width dans mes div!

          en fait ce que je veux c'est avoir les données tabulés (ouais comme dans un tableau tout simplement sauf que je veux un style particulier a ma ligne de tableau que je ne peux pas faire avec un TR)

          donc je veux à la fois de WITDH et à la fois que les données soit sans retour à la ligne


          merci

          • [^] # Re: float: left

            Posté par  . Évalué à 2.

            C'est quoi le problème de le faire avec un tableau exactement ? Un tr id="xxx" ne suffit pas ? Parce que bon des données tabulaires => tableau.

            • [^] # Re: float: left

              Posté par  . Évalué à 2.

              ben d'une part, le style que je veux appliquer aux lignes ne va pas super sur un TR.

              mais aussi, si je parts sur un tableau, ca veux dire que je vais devoir me taper des colspan, parceque toute mes lignes n'ont pas le même format.


              je ne pensais pas que ma demande serait si difficile.

              en solution temporaire, j'ai fait un tableau dans chacune de mes div (un tableau tout con avec une seule ligne).

              et la prochaine fois que je tombe sur un integriste qui me sort que les tableau c'est naze he ben ,j'attendrai qu'il me donne la solution en CSS

        • [^] # Re: float: left

          Posté par  (site web personnel) . Évalué à 1.

          Sinon tu cales une hr invisible (border :0, color:transparent) après ton contenu avec une propriété clear:both.

      • [^] # Re: float: left

        Posté par  (site web personnel) . Évalué à 3.

        Ya plein de techniques diverses et variées pour ca.
        Une pas trop mauvaise:
        http://www.svay.com/blog/index/2005/02/27/241-une-nouvelle-solution(...)

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.