|
Voir le sujet précédent :: Voir le sujet suivant
|
| Auteur |
Message |
| |
|
Nerva
Nouveau WRInaute
Inscrit le: 20 Nov 2006
Messages: 47
Localisation: Picardie
|
 Posté le : Mar Nov 27, 2007 10:30 Sujet du message: Feuille de style et tableaux |
|
|
Bonjour.
Je recherche toute information ou tutoriel conséquent sur la mise en page de tableaux via CSS. Je cherche surtout une manière de baliser qui allègerait au maximum les lignes de code.
Merci. |
|
| |
|
 |
nexxen
WRInaute discret
Inscrit le: 30 Déc 2004
Messages: 68
|
|
| |
|
|
Nerva
Nouveau WRInaute
Inscrit le: 20 Nov 2006
Messages: 47
Localisation: Picardie
|
| Posté le : Mar Nov 27, 2007 11:16 Sujet du message: Feuille de style et tableaux |
|
|
Merci, ce site a l'air très intéressant. 
En fait, je me suis mal exprimé. Ce que je recherche avant tout c'est de supprimer carrément les tableaux en les "simulant" et j'ai trouvé ceci qui correspond exactement à ce que je voulais :
http://pbnaigeon.developpez.com/tutoriel/CSS-HTML/mise-en-page-CSS
L'utilisation de menus est vraiment très simple et les pages HTML très dépouillées... |
|
| |
|
|
Florent V.
WRInaute occasionnel
Inscrit le: 16 Mai 2007
Messages: 181
|
| Posté le : Mar Nov 27, 2007 11:27 Sujet du message: Feuille de style et tableaux |
|
|
| Nerva a écrit: |
| Ce que je recherche avant tout c'est de supprimer carrément les tableaux en les "simulant" |
Mouais, bof. La technique d'intégration HTML/CSS est quand même assez différente dans l'approche de la technique de découpage à coup de tableau de mise en page. Vouloir obtenir un tableau de mise en page en passant par des div par exemple, c'est se planter de démarche à mon humble avis.
Une petite lecture:
Quelle démarche suivre pour intégrer une maquette en page HTML/CSS ?
Sinon, pour les ressources en ligne: tout Openweb, tout Alsacréations.com, tout Pompage.net. |
|
| |
|
|
e-kiwi
Modérateur
Inscrit le: 23 Déc 2003
Messages: 12577
Localisation: Toulouse
|
| Posté le : Mar Nov 27, 2007 11:31 Sujet du message: Feuille de style et tableaux |
|
|
| il est intérréssant de supprimer les tableaux pour mettr en page son haut / menu / contenu / bas de site. je ne vois pas en quoi c'est se planter de demarche |
|
| |
|
|
david11
WRInaute discret
Inscrit le: 24 Nov 2007
Messages: 61
|
| Posté le : Mar Nov 27, 2007 11:39 Sujet du message: Feuille de style et tableaux |
|
|
| voila un autre site http://www.siteduzero.com |
|
| |
|
|
Nerva
Nouveau WRInaute
Inscrit le: 20 Nov 2006
Messages: 47
Localisation: Picardie
|
| Posté le : Mar Nov 27, 2007 12:01 Sujet du message: Feuille de style et tableaux |
|
|
Je ne voudrais pas me lancer dans un débat philosophique "Tableau Vs CSS" mais pour le problème qui se posait dans mon cas, c'était à peu près comme l'exemple du lien que j'ai inséré : un bandeau en haut, un bandeau en bas, et entre deux, un menu et un contenu.
Jusqu'alors, j'avais incorporé un tableau à deux colonnes mais je trouve l'usage du CSS bien plus simple et plus "élégant" qu'un tableau.
Malgré tout, il faut que je peaufine car c'est loin d'être parfait ; j'ai un "margin-left" de 20 pixels dans toutes mes pages (avec ou sans "tableau"), c'est nickel dans FF mais j'ai un décalage à droite dans IE (et donc peut-être aussi dans d'autres navigateurs). De plus, ma page (680 pixels de large) est centrée comme il faut dans FF mais est calée à gauche dans IE ; je précise que j'utilise Dreamweaver 6 pour la conception et qu'en affichage WYSIWYG, elle est également calée à gauche mais se centre correctement en visualisation, tout comme une fois chargée sur le serveur. |
|
| |
|
|
jOoL
WRInaute impliqué
Inscrit le: 04 Mai 2005
Messages: 443
Localisation: par GPS
|
| Posté le : Mar Nov 27, 2007 12:21 Sujet du message: Feuille de style et tableaux |
|
|
| e-kiwi a écrit: |
| il est intérréssant de supprimer les tableaux pour mettr en page son haut / menu / contenu / bas de site. je ne vois pas en quoi c'est se planter de demarche |
Pour la mise en page c'est clair que c'est intéressant. Mais pour afficher des données dans un tableau, il est largement préférable d'utiliser ce qui a été conçu pour, soit la balise TABLE. |
|
| |
|
|
Florent V.
WRInaute occasionnel
Inscrit le: 16 Mai 2007
Messages: 181
|
| Posté le : Mar Nov 27, 2007 12:34 Sujet du message: Feuille de style et tableaux |
|
|
| e-kiwi a écrit: |
| il est intérréssant de supprimer les tableaux pour mettr en page son haut / menu / contenu / bas de site. je ne vois pas en quoi c'est se planter de demarche |
e-kiwi, je n'ai jamais dit cela.
Ce que j'ai dit:
| Citation: |
| La technique d'intégration HTML/CSS est quand même assez différente dans l'approche de la technique de découpage à coup de tableau de mise en page. Vouloir obtenir un tableau de mise en page en passant par des div par exemple, c'est se planter de démarche à mon humble avis. |
Ce que je n'ai pas dit:
| Citation: |
| Vouloir obtenir une mise en page en passant par des div par exemple, c'est se planter de démarche à mon humble avis. |
La nuance n'est pas excessivement subtile, il suffit de ne pas lire en diagonale. |
|
| |
|
|
zeb
WRInaute accro
Inscrit le: 05 Déc 2004
Messages: 1002
|
| Posté le : Mar Nov 27, 2007 17:39 Sujet du message: Feuille de style et tableaux |
|
|
| Nerva a écrit: |
| j'ai un "margin-left" de 20 pixels dans toutes mes pages (avec ou sans "tableau"), c'est nickel dans FF mais j'ai un décalage à droite dans IE (et donc peut-être aussi dans d'autres navigateurs). |
oublie vite l'usage du padding et du margin si tu veux rester compatible IE/ FF l'un va le considérer comme faisant partie du width l'autre non (d'ou décalage de l'affichage). Idem pour les border mais moins problématique dans la mesure ou le problème se situe a la hauteur de la bordure (souvent 1px)
un truc :
deux div imbriquées et un positionnement relatif avec un left qui correspond au padding recherché |
|
| |
|
|
Dan_A
WRInaute occasionnel
Inscrit le: 21 Déc 2005
Messages: 158
|
| Posté le : Mar Nov 27, 2007 17:59 Sujet du message: Feuille de style et tableaux |
|
|
| Citation: |
| De plus, ma page (680 pixels de large) est centrée comme il faut dans FF mais est calée à gauche dans IE ; |
Il manque un DOCTYPE
Dreamweaver n'est pas le bon outil pour passer au HTML/CSS sans tableaux (quand ils ne sont pas sémantiquement corrects). |
|
| |
|
|
Nerva
Nouveau WRInaute
Inscrit le: 20 Nov 2006
Messages: 47
Localisation: Picardie
|
| Posté le : Mar Nov 27, 2007 18:17 Sujet du message: Feuille de style et tableaux |
|
|
Comme DOCTYPE, Dreamweaver me génère celui-ci :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
|
| |
|
|
Florent V.
WRInaute occasionnel
Inscrit le: 16 Mai 2007
Messages: 181
|
| Posté le : Mar Nov 27, 2007 18:25 Sujet du message: Feuille de style et tableaux |
|
|
| zeb a écrit: |
| oublie vite l'usage du padding et du margin si tu veux rester compatible IE/ FF l'un va le considérer comme faisant partie du width l'autre non (d'ou décalage de l'affichage). |
Désolé, c'est faux à 90%.
IE5 utilise effectivement son modèle de boite propriétaire, dans lequel les bordures et padding sont retranchés à la largeur, pour peu qu'on ait spécifié une largeur fixe en pixels, pourcentages ou autre unité. Si la largeur n'est pas spécifiée (margin: auto), ça n'a aucun effet.
IE 6, IE 7, Firefox, Opera, Safari, Konqueror, etc., appliquent le modèle de boite CSS standard. Pour IE6 et 7, il faut bien entendu travailler en mode standard et non pas en mode Quirks, donc avec un Doctype complet avec URL de la DTD.
Pour les histoires de centrage via les marges automatiques qui ne marche pas dans IE: même problème, il faut travailler en mode standard et non pas en mode Quirks.
Travailler en mode Quirks pour faire de la mise en page CSS, c'est suicidaire. |
|
| |
|
|
Florent V.
WRInaute occasionnel
Inscrit le: 16 Mai 2007
Messages: 181
|
| Posté le : Mar Nov 27, 2007 18:27 Sujet du message: Feuille de style et tableaux |
|
|
| Nerva a écrit: |
Comme DOCTYPE, Dreamweaver me génère celui-ci :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
Ce Doctype est incomplet. La page sera rendue en mode Quirks.
Utiliser ce générateur de squelettes (X)HTML pour avoir quelque chose de propre:
http://css.alsacreations.com/outils/squelettor/ |
|
| |
|
|
Dan_A
WRInaute occasionnel
Inscrit le: 21 Déc 2005
Messages: 158
|
| Posté le : Mar Nov 27, 2007 18:28 Sujet du message: Feuille de style et tableaux |
|
|
DOCTYPE incomplet = mode quirks !
Utilise plutôt :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> |
|
| |
|
|
| |
|
|
