Un site qui va révolutionner la face du web

Bouclier anti-ou pas ACTIVE !

www.laadna.fr

En plus son webmaster rox de trop quoi. :/


Remarques constructives fond/formes bienvenues toussa. Le spam d'url porno dans les commentaires sera puni sévèrement.

Le mien est plus intéressant au niveau du contenu quand même ( en plus il marche que sous IE ^^ ) !
www.tenacious.fr

Je me trompe peut être, mais pour que ça marche sous firefox, il suffit d'une petite ligne de code

Pouic a écrit:

Je me trompe peut être, mais pour que ça marche sous firefox, il suffit d'une petite ligne de code

J'avais essayé vite fait de centrer l'image de la même façon sous firefoxe et opera mais sans succès, j'ai pas cherché plus loin depuis ^^
Mais si tu as la solution je suis preneur

Pour centrer verticalement :

Code:

#id {
   text-align: center;
}

Pour centrer horizontalement :

Code:

#id {
    margin-left: auto;
    margin-right: auto;
    width: ...; /* largeur obligatoire pour être centré */
    }

Marche aussi avec les .class

En fait ca fonctionne spécialement !
L'image est centrée horizontalement, par contre verticalement, tout est aligné sur le bas ( en gros le bas de l'image reste collé au bas de la fenètre, et si tu la resize, c'est le haut qui bouge, et horizontalement ça reste centré ).

J'aimerai reproduire ce type d'alignement sous les deux autres navigateurs, mais ils ne semble pas pouvoir prendre en compte l'alignement verticale qui colle sur le bas :/

Ce qui fait tout ça se résume à :

Code:

body {
background-image:url("../img/background.png");
background-position:center bottom;
}

Et il me faudrait donc arriver à rendre la seconde ligne compatible avec les deux autres navigateurs. A la place des center bottom, j'ai essayé avec des pourcentage comme ça se fait aussi, mais rien n'y fait :X

Et avec des marges relatives/auto ?

Hmm bah les marges n'affectent pas les fond de plans nan ? ^^ Mais sinon elle ne sont pas en auto

Si tu veux le code complet du CSS le voici

Code:

body {
color: #000000;
background-color: #FFFFFF;
font-family:"Trebuchet MS",Verdana,Geneva,Arial,Helvetica,sans-serif;
margin:0;
padding:0;
background-image:url("../img/background.png");
background-position:center bottom;
}

( oui oui c'est très long j'avoue ^^ ).

ta essayer en position abolue ?

BeerMan a écrit:

ta essayer en position abolue ?

Non, mais je fais comment en position absolue sachant que le background est cencé coller sur le bas de la fenètre ?

tu peut pas passer par un div tout simple au lieu de mettre l'image en background-image ?

avec par exemple:

Code:

position: absolute;
bottom: 0px;
z-index:-1;

J'sais pas je débute en css mais en cherchant bien ya toujours moyen de contourner les pbs ^^

J'avais essayé avec un div mais je sais plus trop pourquoi j'avais abandonné l'idée ^^ Peut-être parce qu'il est facile de faire en sorte que le div prenne toute la page en horizontal, mais pas en vertical :X

BeerMan a écrit:

tu peut pas passer par un div tout simple au lieu de mettre l'image en background-image ?

avec par exemple:

Code:

position: absolute;
bottom: 0px;
z-index:-1;

J'sais pas je débute en css mais en cherchant bien ya toujours moyen de contourner les pbs ^^

Bouuuuuh le css ça pue !!!! vive le HTML !!!! go dans ton bloc note faire ton site :p

allez un petit indice pour vous aider

notepad++ tres bon bloc note qui colore le code ca aide a faire un site

Noursakamat a écrit:

allez un petit indice pour vous aider

notepad++ tres bon bloc note qui colore le code ca aide a faire un site

Ca fait des années que je connais ça, t'es à la bourre

Noursakamat a écrit:

allez un petit indice pour vous aider

notepad++ tres bon bloc note qui colore le code ca aide a faire un site

Merci mais on t'a pas attendu.

Je suis un putain de noob en HTML mais même moi je savais ça O_o

Faudra que je demande à mon frère ses vieux bouquins de code, depuis le temps il doit les connaître par coeur.

Sinon l'est sympa ton blog laadna! Si tu as envie de faire d'autres des tuto toshop ou de graphisme etc... en général dessus aussi, ca m'intéresse :p

Tenacious D a écrit:

En fait ca fonctionne spécialement !
L'image est centrée horizontalement, par contre verticalement, tout est aligné sur le bas ( en gros le bas de l'image reste collé au bas de la fenètre, et si tu la resize, c'est le haut qui bouge, et horizontalement ça reste centré ).

J'aimerai reproduire ce type d'alignement sous les deux autres navigateurs, mais ils ne semble pas pouvoir prendre en compte l'alignement verticale qui colle sur le bas :/

Ce qui fait tout ça se résume à :

Code:

body {
background-image:url("../img/background.png");
background-position:center bottom;
}

Et il me faudrait donc arriver à rendre la seconde ligne compatible avec les deux autres navigateurs. A la place des center bottom, j'ai essayé avec des pourcentage comme ça se fait aussi, mais rien n'y fait :X

Y faut rajouter background-attachment: fixed;

Plop Laadna, dans favoris.

Zeed a écrit:

Tenacious D a écrit:

En fait ca fonctionne spécialement !
L'image est centrée horizontalement, par contre verticalement, tout est aligné sur le bas ( en gros le bas de l'image reste collé au bas de la fenètre, et si tu la resize, c'est le haut qui bouge, et horizontalement ça reste centré ).

J'aimerai reproduire ce type d'alignement sous les deux autres navigateurs, mais ils ne semble pas pouvoir prendre en compte l'alignement verticale qui colle sur le bas :/

Ce qui fait tout ça se résume à :

Code:

body {
background-image:url("../img/background.png");
background-position:center bottom;
}

Et il me faudrait donc arriver à rendre la seconde ligne compatible avec les deux autres navigateurs. A la place des center bottom, j'ai essayé avec des pourcentage comme ça se fait aussi, mais rien n'y fait :X

Y faut rajouter background-attachment: fixed;

Marche pas avec ie 6 ^^

Sinon essais ça tenacious :
background-image:url("../img/background.png") no-repeat 100% 100%;

Bar'Kha/Ghork a écrit:

Sinon l'est sympa ton blog laadna! Si tu as envie de faire d'autres des tuto toshop ou de graphisme etc... en général dessus aussi, ca m'intéresse :p

Demandez demandez. L'initiation c'est mon dada, même si je ne suis pas un expert j'aime bien transmettre.

BeerMan a écrit:

Zeed a écrit:

Y faut rajouter background-attachment: fixed;

Marche pas avec ie 6 ^^

D'un autre côté mon système marche déjà sous IE 6 donc osef si cette commande est ignorée

J'ai rajouté la ligne de Zeed, et ça fonctionnne maintenant parfaitement sous Opera et Firefox, respect J'étais loin de m'imaginer que de fixer le fond de plan permettrait de corriger ce genre de problème

Merci Zeed !

ouais enfin on voit toujours qu'un arbre avec 2 morbacks assis sur une branche

DaWall a écrit:

ouais enfin on voit toujours qu'un arbre avec 2 morbacks assis sur une branche

Tu t'attendais à voir un film de boule en direct ?
Ya plusieurs mois je voulais mettre un blog à base de joomla en première page mais je trouvais pas ce qui me convenais pour le faire ^^ La j'ai avancé mais ça me convient toujours pas :/ Donc tu ne pourra que regarder les deux morbacks et puis c'est tout !

En fait à la base cette image est pas cencé être la première page de mon site, mais ma page d'erreur 404 ( http://www.tenacious.fr/404.php )
Mais je l'ai mise en page de garde pour faire style et donner au gens l'envie de voir le truc pourri qui la remplacera

non mais je dis ça, je vais surement me faire la même chose

un site unipage, qui me demande pas trop de boulot, vu que j'y connais que dalle, et le reste comme espace stockage internet

je vais surement vous poser des questions dans pas longtemps