Remplacer un tableau
Le
Pascale
Remplacez les tableaux, qu'ils disaient, avec les flottants, c'est
fastoche
Le problème c'est que je dois être trop nulle pour ça.
Alors voilà, j'ai très classiquement un titre, des paragraphes ordinaires.
Et ensuite, je voudrais un truc comme ça :
blablabla blobloblo
blublu blibli
bleblebl blabloblubli
En un mot, un petit tableau sans bordures (-:
Pour la « colonne » de gauche qui est donc maintenant un paragraphe, j'ai
mis :
float: left;
position: absolute;
Pour celle de droite, j'ai mis tout bêtement :
padding-left: 150px;
L'ensemble du « tableau » (2 paragraphes, donc) est inclus dans une div.
Le résultat est correct avec Firefox et Opera, mais avec IE8, c'est la
cata : la 2ème « colonne » est au moins 20px plus bas que la 1ère !
Désolée de poser une question qui paraît probablement bien niaise à la
plupart des gens du forum, mais je ne trouve pas la réponse à ma question.
Si quelqu'un peut m'aider, je l'en remercie.
--
Pascale
fastoche
Le problème c'est que je dois être trop nulle pour ça.
Alors voilà, j'ai très classiquement un titre, des paragraphes ordinaires.
Et ensuite, je voudrais un truc comme ça :
blablabla blobloblo
blublu blibli
bleblebl blabloblubli
En un mot, un petit tableau sans bordures (-:
Pour la « colonne » de gauche qui est donc maintenant un paragraphe, j'ai
mis :
float: left;
position: absolute;
Pour celle de droite, j'ai mis tout bêtement :
padding-left: 150px;
L'ensemble du « tableau » (2 paragraphes, donc) est inclus dans une div.
Le résultat est correct avec Firefox et Opera, mais avec IE8, c'est la
cata : la 2ème « colonne » est au moins 20px plus bas que la 1ère !
Désolée de poser une question qui paraît probablement bien niaise à la
plupart des gens du forum, mais je ne trouve pas la réponse à ma question.
Si quelqu'un peut m'aider, je l'en remercie.
--
Pascale
Pascale ecrit ce qui suit en ce 13/11/2009 20:37 :
Mais si ... ;-)
Mais non ...
<div style="float:left;width:45%;margin-right:2%">
blablabla
blublu
bleblebl
</div>
<div style="float:right;width:45%;margin-left:2%">
blobloblo
blibli
blabloblubli
</div>
(avec les retours chariot kibonbien, évidemment)
Si c'est une position absolue, le float:left n'a pas de sens.
Comme :
<div style="width:99%">
dans lequel tu mets tes 2 colonnes
</div>
Je n'ai pas IE 8 sous la main mais ça devrait marcher.
Cordialement,
--
docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/
J'ai fait qq chose d'approchant avec 3 colonnes qui marche sur tous les
navigateurs quelque soit la taille de la police.
CSS
#colG, #colD{
float:left;
margin-top: 2px; pas obligatoire
width:50%;
text-align:center; pas obligatoire
}
html
<div id="colG">
<p>blabla<br />blabla<br />blabla</p>
</div>
<div id="colD">
<p>bloblo<br />bloblo<br />bloblo</p>
</div>
--
A+
Romer
Faut voir (-:
Je trouve ça un peu bizarre de mettre un float left et un float right car
j'ai l'impression de ne pas savoir par rapport à quoi ils « flottent » (-:
Ça m'apprendra à recopier des bouts de code dans d'autres programmes (à
moi), je me suis basée sur un cas ou le positionnement absolute avait une
utilité, mais là, tu as tout à fait raison, il n'en a pas !
Dans ce genre (sauf que la largeur est bien moindre).
Avec IE, va savoir... d'autant que je n'ai plus IE7 ni IE6 pour tester...
Je te remercie pour ton aide, je vais voir ce que ça donne (-:
--
Pascale
news:1j9551r.jyirz11lv9uaN%:
En gros, Docanski me propose une colonne avec float: left et une avec
float: right, et toi, 2 float: left (-:
Je parie que les deux solutions marchent...
Par contre, s'il y avait une 3ème colonne, tu la traiterais pareil que les
2 autres ?
--
Pascale
Bonjour,
Tu connais probablement, mais Multiple IE est bien pratique pour faire
des tests. Il permet de faire cohabiter plusieurs versions d'IE sans
conflit :
http://www.numerama.com/telecharger/7109-multiple-ie-installer.html
--
Eric
Et bien non, je ne connaissais pas, je te remercie !
--
Pascale
Grmpf, je l'ai installé, mais çamarchepas (:
« L'application n'est pas arrivée à s'initialiser correctement »
Peut-être une incompatibilité d'humeur avec Vista (ça pourrait se
comprendre) ?
--
Pascale
Oui - j'écrirais #colG, #colM, #colD{
float:left;
width:33.3%;
}
Le pourcentage de la largeur-page change evidemment.
En fait 3 éléments d'égale largeur viennent se placer côte à côte à
partir de la gauche.
--
A+
Romer
news:1j98n3b.1ck4pug168wlj4N%:
Merci, je vois que c'est tout bête et que ça marche (-:
--
Pascale
(...)
L'idée n'est certainement pas de supprimer tous les tableaux ! Mais de
ne plus les utiliser à des fins de mise en page.
L'exemple que vous donnez laisse à penser que vous avez bien des données
tabulaires. Pourquoi voulez-vous supprimer l'utilisation du tableau ?