NVU: utilisation de l'éditeur CSS

[toupiti]

bonjour !

voici un code CSS trouvé sur Alsacreations
je n'arrive pas à créer les lignes left:0; du div "menu" et right:0 du div "droite" en utilisant l'éditeur CSS de NVU.

Code CSS :

#conteneur {
position: absolute;
margin-top: 20px;
width: 100%;
background-color:#CCCCFF;
}
#centre {
background-color:#9999CC;
margin-left: 150px;
margin-right: 150px;
}
#menu {
position: absolute;
left:0;
width: 150px;
}
#droite {
position: absolute;
right:0;
width: 150px;
}
#pied { background-color: #99CCCC; }

qui connait la solution ?
merci et bonne soirée !

[theoliane]

et en mettant l'unité ? Par exemple 0cm, ou 0px ?
Suis pas du tout sûre que ce soit ça, parce que je suis en train d'apprendre, justement !

[Milvus]

Si l'unité n'est pas obligatoire en cas de valeur nulle, l'espace après le ":" l'est lui.

Voila un exemple de code valide :

Code: Tout sélectionner

#menu {
position: absolute;
left: 0;
width: 150px;
}

[fun sun]

Bonjour toupiti,

Il faut d'abord créer la règle "#gauche". Cette dernière activera les onglets correspondant au div que l'on va placer à gauche. Ensuite il faut aller à l'onglet boîte. Choisir la position, ici absolue.

Ensuite il faut vous reporter vers le bas, 3 menus apparaissent :

marges, remplissages, excentrages.

Marges : les marges extérieures du div.

Remplissages : les marges intérieures du div

Excentrages : déplacer le div par rapport à son "centrage" initial d'où ex-centrage. Choisir l'option "gauche" et 0pt ou 0%. Ce qui correspond à left:0

Répéter les mêmes opérations pour le div droite et voilà

[mpop]

Si l'unité n'est pas obligatoire en cas de valeur nulle, l'espace après le ":" l'est lui.

Voila un exemple de code valide :

Code: Tout sélectionner

#menu {
position: absolute;
left: 0;
width: 150px;
}

Vraiment ? J'ai un gros doute là.
Que disent les specifications, et comment est-ce implémenté.
Première fois que je vois mention d'un espace obligatoire dans ce cas (ce qui irait à l'encontre de la règle générale pour la syntaxe CSS).
Testé avec Firefox, le code suivant ne pose pas de problème :

Code: Tout sélectionner

div {
   position: absolute;
   right:0;
   bottom:0;
}

[Milvus]

Euh... Là j'ai un doute du coup.

J'ai regardé les specs CSS2 et voilà ce qui est marqué :

A declaration is either empty or consists of a property, followed by a colon (:), followed by a value. Around each of these there may be whitespace.

http://www.w3.org/TR/REC-CSS2/syndata.html#declaration


"may be" donc en effet l'espace ne serait pas obligatoire et ces quatre lignes parfaitement équivalentes :

Code: Tout sélectionner

left :0;
left : 0;
left: 0;
left:0;

Mais je suis à peu près sur que dans le monde réel, la forme left: 0; avec un espace après les deux-points est de loin la meilleure à adopter pour éviter les problèmes de navigateurs et d'UA buggé. En tout cas c'est la forme utilisée dans tous les exemples des specs CSS, et celle que je respecte scrupuleusement depuis que je m'efforce de faire du code 100% valide.

[mpop]

Mais je suis à peu près sur que dans le monde réel, la forme left: 0; avec un espace après les deux-points est de loin la meilleure à adopter pour éviter les problèmes de navigateurs et d'UA buggé. En tout cas c'est la forme utilisée dans tous les exemples des specs CSS, et celle que je respecte scrupuleusement depuis que je m'efforce de faire du code 100% valide.

Je pense que c'est surtout utilisé de cette manière pour respecter la syntaxe... de l'anglais (note : en typographie française, bien que ce ne soit pas tout à fait une règle absolue, les signes de ponctuation double sont précédés et suivis d'une espace).
C'est également pratique pour distinguer chaque élément du coupe propriété/valeur.

Mais je doute que ça ait la moindre incidence sur les parseurs des navigateurs.
Au passage, plusieurs éditeurs n'ajoutent pas d'espace après le « : ». C'est par exemple le cas de Dreamweaver (qui n'est certes pas une référence, mais si ça posait un réel problème d'interprétation par les navigateurs les développeurs auraient rectifié.