CSS Table ou DIV

Répondre
DaRkSeeD
le 15/07/2005 à 05:55
DaRkSeeD
Salut TLM !!

J'ai naviguer beaucoup sur le site de CSS pour me rendre compte que plusieurs site avait carrément laissé tomber les tableaux et créait des tableau avec des DIV et du CSS.

J'ai donc décider de m'essayer pour faire un tableau avec du CSS et de DIV pour réaliser que ce n'était pas aussi facile que je croyait.

Je me demandais alors si ça vos la peine de me casser la tête a faire mes tableau en DIV ou bien je continu a les faire avec <table> et du CSS pour leur donner un look ?

Y'a t'il un avantage a utiliser le DIV ???

Merci,
mojorisin
le 15/07/2005 à 08:10
mojorisin
Les tableaux à l'origine ont été fait pour présenter des données ... tabulaires :)
Ils ont été détournés par les designers afin de structurer des pages web complexes.
Les avantages d'utiliser des block div en lieu et place des tableaux sont multiples :
- Avoir des sources sémantiquement correct
- Le code est beaucoup plus maintenable
- Les pages sont plus accessibles
- Le chargement et l'affichage des pages sont plus rapide

L'inconvéniant est qu'il n'est pas simple de mettre en place un design complexe à l'aide de ce système.
echo ’16i[q]sa[ln0=aln100%Pln100/snlbx]sbA0D4D465452snlbxq’|dc
DaRkSeeD
le 15/07/2005 à 17:05
DaRkSeeD
Merci beaucoup !!!

Sa me donne une bonne idée !!

Est-ce que vous savez si il y a une façon d'alligner plusieurs DIV sur une meme ligne sans utiliser le float et sans dir le left exact a laquelle il doit être afficher.

La raison c'est que je veut mettre un DIV dans un DIV et avec firefox si je les met float mon DIV principale n'affiche pas le background. Il fait comme si il n'avait rien a l'intérieur ce qui est normal. Et si je lui met un &nbsp; alors tous mes mesure sont alors corrompu car le &nbsp; prend 4pixel.

<div style="width: 200px;"> <!-- celui ne va pa s afficher de couleur en background, firefox le voit comme si il était vide -->
<div style="float: left; width:100px;"> <!-- //celui ci va s'afficher -->
ALLO
</div>
<div style="float: left;" width:100px;> <!-- //celui ci va s'afficher -->
ALLO
</div>
</div>
Bzh
le 17/07/2005 à 20:23
Bzh
Je te conseil pour un design compliqué de mettre tout les div conteneurs en "position absolute". Ainsi, tu peux les positionners comme tu veux au pixel près avec "top" et "left"...

Maintenant, si c' est pour dessiner des tableaux, apart le "float: left " ou "float: right" je ne vois pas d' autre solution.

Mais ce n' est vraiment pas simple de simuler des tableau en simple CSS !!!!!

Bye...
DaRkSeeD
le 18/07/2005 à 04:41
DaRkSeeD
ok !! je voulais seulement savoir s'il y avait une autre facon !!!

Je crois que je vais me tenir a faire mes tableau en tableau. J'ai réussi avec les float tout fonctionne en IE mais en Firefox mon DIV conteneur ne prend pas le bgcolor ou les border, bref il ne s'agrandit pas a son contenue. Et tout comme La globule je n'aime pas le absolute.

Merci
SuperHeidiMAN
le 18/07/2005 à 21:02
SuperHeidiMAN
Arf
J'ai réussi avec les float tout fonctionne en IE mais en Firefox mon DIV conteneur ne prend pas le bgcolor ou les border

Rho le mauvais firefox il arrive pas à afficher ta page correctement a moins que ca soit la faute a IE qui accepte tout et n'importe quoi ^^

Bref
bgcolor = background-color en CSS

Et pour les border faut lui preciser :
border-style: solid; pour qu'il te face une bordure.

Si ton DIV ne s'agrandit pas c est peut etre parce que tu la remplis de float ?
Si c'est le cas je te renvoi ici http://openweb.eu.org/articles/initiation_float/ ou tu trouvera un bon tuto pour les floats
DaRkSeeD
le 19/07/2005 à 02:52
DaRkSeeD
Bien tu as raison c'est IE qui ne le fait pas comme il le faut. Un DIV ne devrait pas s'agrandir a cause qu'il y a seulement des float donc je vais vérifier ton tutorial !!

Merci
DaRkSeeD
le 19/07/2005 à 03:08
DaRkSeeD
Voilà j'ai trouver grace au tutorial.

La propriété FLOAT ne fera pas agrandir un DIV vide, donc c'était la raison pourquoi je n'étais pas capable de bien faire afficher en Firefox.

Maintenant pour règler le problème je devais mettre qqch dans le DIV :

1. Le &nbsp; ne fonctionne pas car il changer la largeur du DIV et toutes les dimensions sont changer.

2. La façon qui fonctionne : <br style="clear:both; visibility:hidden;" />

smiley
Répondre
LoadingChargement en cours