Il s'agit d'avoir deux colonnes de 50% de la largeur chacune.
ce qui veut dire qu'on doit pouvoir redimentionner en largeur
les deux colonnes doivent �tre entour� d'un cadre.
comme un petit dessin est parfois plus clair.
voila ce qu'il me faut
http://www.webshaker.net/images/css.jpg
Donc il faurait que j'arrive je ne sais pas comment a gerer le border
collapse entre deux div floattant.
quelqu'un a une id�e ?
Merci
Bonjour
Quelque chose comme �a ?
// Fichier style.css
body {
font-family: /* ...etc... */
/* Diverses d�clarations de taille */
/* ... */
padding:0;
margin:0;
}
div.tout {
/* Pour une bordure graphique, je ne sais pas */
border:1px;
text-align : center;
width : 99%;
}
div.bloc_gauche {
float: left;
width: 45.5%;
}
div.bloc_droite {
float: right;
width: 45.5.%
}
hr {
visibility:hidden;
clear:both;
}
div.bloc_bas {
text-align:center;
width:99%;
border:0;
}
-----------------------------
Et puis...
Pour le HTML :
( Il faut v�rifier que les contenus des deux div c�te-�-c�te sont
d'encombrements suffisamment similaires, pour qu'il n'y ait pas
recouvrement d'un bloc par l'autre. )
/* ne sais plus les d�clarations au dessus du body.
<body>
div class="tout">
<div class="bloc_gauche">
</div>
<div class="bloc_droite">
</div>
<hr />
<div.bloc_bas">
</div>
</html>
------------------------------
Me corrige qui veut.
Bien � vous.
Amicalement.
Jean-Fran�ois Ortolo
--
Visitez mon site gratuit donnant des Statistiques,
des Pronostics et des Historiques Graphiques
sur les Courses de Chevaux:
http://www.pronostics-courses.fr
Bien entendu ! ;-)
Le secret ? overflow: auto;
l'astuce ? sur le div de gauche : margin-right: -1px;
(1px = largeur de la bordure)
� voir ici : <http://cjoint.com/?1knrTiZjRjm>
et � v�rifier avec les IEs
dont j'ai touj la flemme de les r�-installer
--
St�phane Moriaux avec/with iMac-intel
Si je n'ai pas fait d'erreur dans la copie/interpr�tation de tes css,
avec �a : <http://cjoint.com/?0knr7LEXby>
j'obtiens : <http://cjoint.com/?0knsbyRcJxQ>
Le coup des 45.5% pour la largeur de chaque colonne ne fonctionnera (ne
fera se recouvrir des bordures "communes") que pour une certaine largeur
de fen�tre et encore ...
> div.tout {
>
> /* Pour une bordure graphique, je ne sais pas */
> border:1px;
> text-align : center;
> width : 99%;
> }
>
> div.bloc_gauche {
> float: left;
> width: 45.5%;
> }
>
>
> div.bloc_droite {
> float: right;
> width: 45.5.%
>
> }
>
> hr {
> visibility:hidden;
> clear:both;
> }
--
> Le coup des 45.5% pour la largeur de chaque colonne ne fonctionnera (ne fera se recouvrir des bordures "communes") que pour une
> certaine largeur de fen�tre et encore ...
Certes, mais quel est le d�bile au W3C qui a invent� qu'on doit pr�ciser la largeur d'un bloc, d'apr�s *l'int�rieur*, donc en
�liminant les marges etc.
Ce n'aurait pas �t� plus logique que width: 50% ce soit 50% *hors tout* du bloc ? Pour faire ch*er les cr�ateurs de site ?
--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
> Ce n'aurait pas ᅵtᅵ plus logique que width: 50% ce soit 50% *hors tout* du
> bloc ? Pour faire ch*er les crï¿œateurs de site ?
Pour ne considï¿œrer que la surface utilisable du bloc. Mais il est
vrai que c'est discutable.
Heu ...
La bordure, ce n'est pas d�bile de la consid�rer comme ext�rieure.
La marge n'est pas *dans* le bloc ... elle ne devrait pas compter dans
la largeur du bloc.
Heureusement, je crois bien qu'elle s'ajoute � la bordure.
Par contre :
with: 50%; + padding: 20px, qui �largit la largeur ...
�a, oui, �a fait chier !
Apr�s,
qu'un overflow supprime cet accroissement de la largeur par le paddind
... va comprendre ? !
> Ce n'aurait pas �t� plus logique que width: 50% ce soit 50% *hors tout*
> du bloc ? Pour faire ch*er les cr�ateurs de site ?
Je crois que de quelque c�t� que tu puisses cr�er des r�gles, il y aura
fatalement � un moment ou � l'autre une r�alisation de mise en page qui
aura des pbs, et pour laquelle il faudra ou changer de conception ou
trouver l'astuce.
>>> Le coup des 45.5% pour la largeur de chaque colonne ne fonctionnera (ne fera se recouvrir des bordures "communes") que pour une
>>> certaine largeur de fenï¿œtre et encore ...
>>
>> Certes, mais quel est le dᅵbile au W3C qui a inventᅵ qu'on doit prᅵciser la largeur d'un bloc, d'aprᅵs *l'intᅵrieur*, donc en
>> ï¿œliminant les marges etc.
>>
> Ne serait-ce pas la philosophie de la "surface client" ᅵ l'intᅵrieur d'une fenᅵtre. Effectivement c'est plutᅵt de la programmation
> Windows.
C'est plutᅵt de la "nouvelle philosophie" ᅵ la BHL.
>> Ce n'aurait pas ᅵtᅵ plus logique que width: 50% ce soit 50% *hors tout* du bloc ? Pour faire ch*er les crᅵateurs de site ?
>
> Pour ne considï¿œrer que la surface utilisable du bloc. Mais il est vrai que c'est discutable.
C'est mᅵme profondᅵment dᅵbile : ᅵ quoi ᅵa sert de mettre des pourcentages, si ce n'est pour ne pas pouvoir les utiliser ? C'est
pourtant pas un cas de design exceptionnel que de vouloir 2 ou 3 colonnes dans une page web ?
C'est pour ᅵa, ᅵ mon avis, que des millions sites sont en "largeur fixe", parce qu'on ne peut pas fixer des largeurs de colonnes
ï¿œlastiques. Ou alors on utilise des tables...
D'oᅵ le dᅵchainement contre IE6 parce qu'il ne gᅵrait pas les marges
de la mï¿œme faï¿œon. C'ï¿œtait bien la moindre de ses insuffisances
(pourtant nombreuses) et j'ai montrᅵ dans un petit tuto qu'on arrivait
parfaitement ᅵ le dresser pour qu'il saute pareillement dans les
cercles enflammï¿œs comme FF et Opera et ce sans danser la java (script).
Merci.
C'�tait effectivement la bonne piste a suivre.
J'ai finalement utilis� margin-left:-1px sur le deuxieme bloc.
ce qui a eu pour effet de d�caler le bloc de 1 pixels vers la gauche et
donc de r�aliser le collapse voulu.
Ce qui donne
<div style='clear:both; width:100%;'>
<div style='float:left; width:50%; border:1px;'>blabla</div>
<div style='float:left; width:50%; border:1px;
margin-left:-1px'>blabla</div>
</div>
Par contre je ne sais pas trop si ca marche partout.
Etienne