28173 sujets

CSS et mise en forme, CSS3

Bonsoir,

Je rencontre un souci sur une page que je suis en train de créer, uniquement sous Firefox.
Je souhaite mettre plusieurs DIV les uns à côté des autres de gauche à droite sur une page web, du coup j'utilise la propriété display:inline pour éviter le retour à la ligne automatique après le DIV. Cependant, dans mon application je me vois obligé de fixer dynamiquement les dimensions (width/height) de mes DIV en javascript.

Mon problème se situe ici : lorsque la propriété display est renseignée à inline, la width et la height du DIV ne sont pas pris en compte sous Firefox. Par contre si je ne renseigne pas la propriété display ou que je la renseigne à block, les width et height sont bien pris en compte.

Pour simplifier j'ai créé deux pages d'exemple :

Avec display:inline

Sans display:inline


D'autre part, savez-vous pourquoi le DIV gris est décalé de quelques pixels par rapport au haut de la page ?

Merci d'avance pour votre aide.
Bonjour blueoliv et bienvenue sur Alsacréations Smiley smile ,

Connais-tu la propriété float ?

Sinon vite vu, il me semble contre-productif de laisser son contenu uniquement à javascript. En son absence chez le client ta page n'affiche rigoureusement rien Smiley eek . Mais peut-être es-tu dans une situation où ton application tourne sur un parc de navigateurs tous identiques dans leur configuration, tous avec javascript activé.

Sinon sur Alsacréations on aime bien les pages munient d'un doctype Smiley cligne :
Les DTD HTML4.01 et XHTML1.0 : comment choisir ?
Bonsoir Igor,

Je connais la propriété float mais dans mon application le float ne changeait rien à mon affaire. Cependant, je viens de contourner mon problème d'affichage Smiley ravi
En fait j'avais oublié de mettre certains éléments dans un DIV, du coup rien ne se positionnait comme je le voulais (car j'utilisais des position relative) et je m'étais vu obligé d'utiliser display:inline pour obtenir un résultat correct.

Pour répondre au point que tu soulignes quant à la génération du contenu de ma page en javascript, en fait l'application est destinée uniquement à une seule personne (mon papa en l'occurence Smiley smile ) mais effectivement il faudra que je m'inquiète un jour des clients sans javascript ou avec un javascript peu évolué si je désire étendre cette application à plusieurs personnes.

Effectivement le doctype .. il va falloir que je me penche sérieusement sur la question d'avoir des pages propres Smiley biggol

Merci pour tes conseils judicieux.

blueoliv