28173 sujets

CSS et mise en forme, CSS3

Bonjour tout le monde :

je vous explique mon souci du moment (parceque ca j'en manque jamais).

J'ai 3 blocs flottants gauche droite centre (jusque la rien que du très classique). Ils sont en position relative avec hauteur minimale (min-height).

Dans chacun de ces blocs je veux un pied de bloc que je met donc en position absolue (tout en bas du bloc). Le bloc et le pied de bloc ont un background differents.

Sur Firefox:
- le pied de bloc se met a sa place bien en bas pas de soucis
- sur ff la couleur du pied passe par dessus la couleur du bloc (ce que je souhaite donc)
Sur ie 7
- le positionnement est bon le texte est en bas et au dessus du bloc
- et là c'est le drame la couleur du pied de bloc n'apparait pas Smiley bawling

Jai regardé dans le forum mais je n'est pas trouvé de solution

Ma CSS :
#bloc_gauche {
	float: left;
	width: 300px;
	min-height: 400px;
	margin: 0px 15px 10px 5px;
	border: 1px solid silver;
	position: relative;
        background: blue;
}

.piedbloc{
  border-top: 1px solid silver;
  background: grey;
  color: red;
  text-align: right;
  position: absolute;
  bottom: 0;
  width: 100%;
}


Si une ame charitable (et compétente Smiley lol ) passe par la pour m'expliquer le pourquoi de ce non affichage de mon background absolue (ouahh la phrase Smiley rolleyes ) je l'en remercie par avance.
Modifié par gilles6975 (02 Mar 2009 - 19:20)
Hello, Smiley smile

Il manque un "left" ou un "right" sur .piedbloc.

Sinon, 3 flottants pour un design en 3 colonnes, c'est un flottant de trop (pour la colonne du milieu mieux vaut couler in the flux + combinaison width / margin-left).

Si le problème persiste, paye ta page en ligne !
Quand tu mets une bordure d'1px sur ".piedbloc", elle englobe tout le bloc ou pas ?

A tester :
- overflow:hidden (sur ".piedbloc" et/ou sur "#bloc_gauche"),
- height fixe (sur ".piedbloc"),
- t'as essayé de rajouter un "right" ou un "left" comme je te l'ai suggéré dans mon premier message ? IE n'aime pas quand on les oublie...


EDIT :
Il manque un guillemet, erreur de c/c ?
<div id="bloc_gauche>

Modifié par BeliG (02 Mar 2009 - 18:04)
Hello,

Avec une valeur hexadécimale (#CCC par exemple), le modèle de couleurs RGB (background: rgb(128,128,128); )ou tout simplement avec gray cela semble mieux fonctionner Smiley cligne

J'oubliais : lien
Cdt,
Sylvain
Modifié par 6l20 (02 Mar 2009 - 18:15)
aie aie aie ... ca fait mal .. c'est dur... rabaissage d'ego au niveau -1


une faute de frappe et 2 heures de perdues - 2 alsanautes qui perdent leur temps

6l20 merci beaucoup et encore désolé BeliG


Smiley fache je m'en veux d'autant plus que pendant tres tres longtemps j'étais un adepte du hoover a la place du hover et v'la que ca recommence

Gilles qui passe en résolu...confus


edit : ce qui est marrant c'est que firefox ait compris mon grey comme un gray
Modifié par gilles6975 (02 Mar 2009 - 19:41)
Non, non, non ne te fustige pas, il me semble qu'il s'agit simplement de choix de developpeurs et plus exactement de la localisation de la langue parlée et écrite, en bref :
gray : UK English - a priori préconisé par le W3C, et utilisé par IE
grey : US English - utilisé par Firefox (en autre ?), mais qui n'a semble t-il aucun soucis pour implémenter "le standard gray"...

Ce sont des petites différences que l'on retrouve pour d'autres mots :
- colour and color, labour and labor, centre/center, theatre/theater, etc...

Que les érudits n'hésitent pas à me corriger (au sens figuré bien évidemment, vous pouvez ranger les pelles Smiley lol ) et à apporter une explication plus technique, je cite de mémoire et je suis vieillissant...^^

Bien vous.
Cdt,
Sylvain
Salut,

+1 pour l'explication américain/anglais.

Un bon résumé issu de cet article :
a écrit :
Gray is a color.
Grey is a *colour*.

D'un point de vue web la couleur gray est à l'origine l'une des 16 couleurs standards définies par les specs d'html 3.0 (lire la remarque : "Ces couleurs sont issues des 16 couleurs standards supportées avec la palette VGA Windows").

Mais aussi loin que je remonte dans mes souvenirs on pouvait aussi bien utiliser gray que grey.