28220 sujets

CSS et mise en forme, CSS3

Salut a tous,

Tout d'abord toutes mes felicitations pour les createurs et administrateurs de ce site, aussi pratique que beau ... chapeau.

Voici mes problèmes :

Actuellement je m'occupe d'un site dont la mise en page repose, comme beaucoup, sur des tableaux.

Soucieux de m'améliorer, et donc de rendre mon site plus pratique, moins lourd, et surtout d'y appliquer des normes, je me met au CSS.

J'ai lu pratiquement tous les tutos sur les "tabeaux" CSS ... je dis tableau juste pour la forme, on sait bien que ce n'en est pas ...

La future maquette de mon site (sur laquelle je commence a peine de travailler) repose sur un cadre principal, centré, d'une largeur proche de 800 px ... dans ce cadre viendra un logo en haut, un menu a gauche et la partie utile a droite ... bien classique.

cette partie de droite me pose problème, je n'arrive pas a la placer correctement ...
Si j'utilise des div en float, ca marche très bien sous FX, mais c'est la catastrophe sous IE ... et si j'utilise pas de mode float ... ben j'arrive pas du tout a faire ma mise en page, mes div sont les 1 en dessous des autres.

voici ce que j'ai fait (j'ai epuré pour permettre une meilleur lecture, et j'ai mis des cadres en contours voyant pour bien voir le pb)

http://test.arpete.com

deux versions (via le lien) : avec float, et sans float.

avec float : ok sous FX, tout décalé sous IE (les marges ne font pas les tailles que je demande)

Sans float : marges ok sous IE et FX mais je n'arrive pas a mettre ma partie utile a droite du menu de gauche.

Pouvez vous me filer quelques tuyaux ... il y a surement un truc très important que je rate.

j'ai bien pensé aux positions absolues, mais comment faire de l'absolu quand on souhaite centrer le tout ... ca me semble impossible ... a moins qu'une astuce permette de modifier l'origine ...

Thx de votre aide a l'avance ... et j'espere ne pas trop etre ridicule sur ce coup.
Vous trouverez les codes sources et le CSS facilement grace au lien collé ci dessus.
Bonjour,

Pour corriger la version avec float dans IE : il s'agit du bug de la double marge des flottants. IE double la valeur de la marge droite d'un flottant à droite (et réciproquement à gauche)...

Pour aller au plus simple, la correction consiste à ajouter la propriété display:inline à ce flottant .partie_utile. Elle ne sera d'aucun effet dans les autres navigateurs. Il est cependant préférable de la réserver à IE 5.x - 6.0 Windows, en la cachant dans une CSS en commentaires conditionnels (voir la FAQ du forum à ce sujet)
Modifié par Laurent Denis (13 Oct 2005 - 15:20)
Et pour faire une version sans float ... ya pas moyen de lui dire que le div suivant est a mettre à la suite plutot qu'en dessous ?

ca doit bien etre possible non ?

merci en tous cas pour la reponse précédente, qui fonctionne Smiley smile