Mais comment on fait ça ?

[joeglibops]

Ca à l'air tellement bête, et c'est un cauchemar à organiser...

Comment fait on pour avoir un logo (une image) centré horizontalement et verticalement dans une page web toute vide ? (en CSS a priori)

merci tout plein aux ceusses qui sauront m'éclairer.

joe

[goulven]

sans CSS, c'est un tableau avec 9 cellules ...
avec CSS, je sais pas :#

[joeglibops]

ouais, j'ai essayé de repasser le concept du tableau dans le CSS.
Mais, que je fasse 9 boxes ou 1 seule avec les marges plus ou moins flottantes.. j'arrive au mieux à un truc plus ou moins flottant, mais jamais absolument au milieu...

J'ai aussi essayé d'inverser le truc, et de jour sur le padding d'une boxe de la taille de la fenêtre web... mais rien non plus...

grmmmblle

[mediapress]

allez une question ridicule !!

Pour moi, les css, ce sont les feuilles de style, mais apparement cela fais autre chose ? C'est quoi exactement ??

Et n'écoute pas Goulven, il dis des bétises (comme d'hab ), c'est un tableau avec 1 cellule !!

[joeglibops]

Sisi, c'est bien des feuille de style...
mais le CSS peut s'appliquer au texte (comme une feuille indd ou Xpress) ou aux images (objets en fait)... et là, c'est sensé être drôle,

sauf, qu'en fait, c'est surtout frustrant de pas arriver à faire un truc aussi basique.

[mediapress]

ca sert à quoi de mettre une feuille de style sur une image ? maintenant, on arrive à placer au pixel près les images, je me pose la question ???

[joeglibops]

Ben, erm...
disons que je débute en CSS, hein... Alors les pros vont surement se marrer en me lisant...
J'assume mon incompétence (actuelle), allons-y :

La feuille a l'intérêt de pouvoir être placée à part dans ton site, et que toutes (ou toutes celles que tu veux) tes pages s'y réfèrent (pour styler le texte, of course, mais ça peut aussi inclure un truc du genre : je veux une colonne à gauche immobile contenant une image, etc.)

C'est donc une économie de code...
et tu es censé pouvoir faire des belles pages avec des pseudo frames et tout et tout en CSS.

le seul truc, c'est que c'est aussi intuitif que le chinois pour moi...

[mediapress]

ca a l'air pas mal, je viens de voir des exemples, apparement c'est une autre manière de bosser... En ce qui concerne on problème tu as résolu ton problème de centrage ??

[catif]

Alors, c'est tout simple... quand on a un peu l'habitude des CSS !

Pour centrer horizontalement et verticalement une image dans la page, il faut recourir au positionnement absolu des éléments. Le code HTML est (pour une image de taille 260x160 pixels par ex) :



Le code CSS est alors :

div#contenu {
position: absolute;
left: 50%;
top: 50%;
margin-top: -80px;
margin-left: -130px;
}

En fait, il faut donner des marges top et left égales à la moitié de la hauteur et de la largeur de l'image.
Attention ! Ce code bugue avec IE5/Mac. Il y a un hack, que je rechercherai si tu en as besoin...
Voilà, tu verras qu'avec un peu d'habitude et de pratique, les CSS représentent un vrai gain de temps. Il faut juste désapprendre certains réflexes acquis avec le codage en tableaux.
En espérant t'avoir aidé :=!

[catif]

Zut, le code html a été interprété dans le post...

Alors, le code HTML :

<div id="contenu"><img /><div>