Création
d'entreprise
Posez votre question Signaler

CSS tableaux et div

patamob - Dernière réponse le 4 nov. 2010 à 12:01
Bonjour,
j'ai un tableau HTML qui fait ça :
<table width="100%">
<tr>
<td width="300" valign="middle">blabla</td>
<td align="top">blublu</td>
</tr>
</table>

comment faire la meme chose en DIV et CSS ?
Lire la suite 

CSS tableaux et div »

4 réponses
Réponse
+0
moins plus
Salut.
Il faut rendre un des deux div flottant.
Tu mets une largeur de 300px au premier
Au second, tu lui mets une marge à gauche de 300px ou plus.

<div>
    <div style="float: left; width: 300px;">Première colonne</div>
    <div style="margin-left: 300px;">Seconde colonne</div>
    <div style="clear:both;"></div>
</div>
patamob - 4 nov. 2010 à 01:52
pourquoi un div vide après la 2eme colonne ??
avion-f16- 4 nov. 2010 à 12:01
Parce que le div flottant ne sera pas pris en compte dans la hauteur du <div> qui englobe le tout.
Donc si tu places un élément en-dessous du div global et que le div flottant (gauche) est plus long que celui de droite, alors le div de gauche se mélangera à l'élément après le div global.
Ajouter un commentaire
Réponse
+0
moins plus
Bonjour

Donc voilà pour commencer, on doit cibler dans le html une feuille de style comme vous le savez déjà.

Pour faire ce que vous voulez, c'est assez simple. Vu que ça n'a pas l'air important (blabla, blublu), je vais utiliser quelque chose de très simple.

Donc pour le html, on met ça:

<div id="texte">
<p class="blabla">blabla</p>
<p>blublu</p>
</div>

Pour le css:

#texte p{
display: inline;
}

#texte .blabla{
padding-right: 200px;
}

Voilà, vous avez vos mots, bien positionné. Bien sûr, il y a plusieurs façon de le faire mais pour le petit exemple ça donne ça.

En espérant vous avoir aidé.

Invitation à contact hors CCM supprimée Modération CCM

Merci
Ajouter un commentaire
Ce document intitulé « CSS tableaux et div » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?