28173 sujets

CSS et mise en forme, CSS3

Bonsoir,
Sur mon site j'ai mis des bordures sur le coté droite/gauche à 100% oki pas de problème ça passe niquel, mais quand ton scroll en bas alors les bordures disparaisse !

Je vous est fait une page de test juste ici ...

Scrollez et vous verrez les bordures descendres ...
J'ai cherché en vain mais pas trouvé, et c'est la meilleure solution pour les bandes comme ceci sans bug sur aucun navigateur Smiley smile

Je vous donne pas le code de la page puisqu'il est sur la page test ici

Merci d'avance Smiley smile
Salut,

pourquoi tu n'indiques pas directement un padding dans ton body? par exemple:


body {
padding: 0 15px;
background-color: #000;
}


et tu introduis ensuite une DIV qui englobe tout ton contenu avec du blanc comme couleur de fond... non?
Tu peux ainsi abandoner tes colonnes à gauche et à droite qui ne te servent qu'à créer une bordure.
Modifié par SuD (19 May 2006 - 09:17)
Bonjour Bleeps,

La finalité c'est d'avoir une bordure noire à droite et à gauche?

Si c'est le cas, tu peux réaliser ça uniquement en travaillant sur les effets visuels avec les fonds.

En effet tu utilise deux conteneurs qui sont à 100% de la hauteur de lapage et ils font exactement ce que tu leur demande, ils font 100% de l'écran.

Une fois que l'on scroll plus bas que le premier écran, tes conteneurs font toujours 100% de l'écran original, mais effectvement ne vont pas jusuq'en bas puisque l'on dépasse les 100% d'affichage d'un écran.

Je ne sais pas si je suis très clair, au cas ou n'hésite pas à me demander des éclaircissements.

Autrement pour le même effet (ou assez proche) tu peux faire ceci :

http://www.aj-crea.com/exercices/test_Bleeps.htm

Qui limite le nombre de conteneurs inutiles et joue sur les fonds.

En espérant t'aider,
Aymeric

[EDIT] tohhh grillé par SUD avec une autre technique ^^
Modifié par AymericJ (19 May 2006 - 09:11)
SuD a écrit :
Salut,

pourquoi tu n'indiques pas directement des marges dans ton body? par exemple:


body {
margin 0 15px;
background-color: #000;
}

...


Tiens d'ailleurs, un padding: 0 15px; plutôt qu'un margin, ce ne serait pas plus "sémantiquement" correct? Puisqu'on parle de marge intérieure?
AymericJ a écrit :

Tiens d'ailleurs, un padding: 0 15px; plutôt qu'un margin, ce ne serait pas plus "sémantiquement" correct? Puisqu'on parle de marge intérieure?


Exact, je modifie mon post , merci Smiley smile
Modifié par SuD (19 May 2006 - 09:17)
AymericJ -> Ta technique ne marche pas sur IE 5.0 / IE 5.5, en plus ça tu le savais pas sur la page test mais dans #left, j'ai un bg-image normalement et #left:hover ... Donc faut que je garde la div Smiley smile

SuD -> j'avais testé cette technique mais après je rajoute une bordure dessus très fine et sur Firefox 1.0.7 cela merdait !

J'ai changé le code de la page test, pour montré un peu plus ma page comment elle est Smiley smile

ICI

Voila, donc vos solutions ne marche pas =/
Re Bleeps,

Honnêtement, actuellement je te dirais bien de ne pas de prendre la tête pour des rendus graphiques pour des navigateurs obsolètes.

Essaies d’avoir un rendu graphique « correct » sur la plupart des navigateurs, garde les prouesses techniques pour les navigateurs capables de les interpréter correctement.

L’important c’est que ton information soit accessible à tous.

Il ne s’agit pas là de « racisme » par rapport à tel ou tel navigateur, mais juste que le jeu au final n’en vaut pas la chandelle.
Oui mais si on peut autant le faire !

Et puis je vois que dans les stats de mon site une bonne majorité tourne sur IE, donc bon j'aimerais leur montrer un égal de mon design ... (petit coté perfectionniste ...)

Donc je cherche la solution à mon problème Smiley smile
Le problème du padding et autre est que j'ai une image dans la bordure de gauche en background Smiley smile

Donc si quelqu'un à une idée/solution à me soufler j'en suis volontié !
Merci d'avance Smiley smile
Salut,

AymericJ a écrit :

Tiens d'ailleurs, un padding: 0 15px; plutôt qu'un margin, ce ne serait pas plus "sémantiquement" correct? Puisqu'on parle de marge intérieure?


Non, mieux vaut utiliser la propriété margin. C'est plus sur même si ça ne règle pas tout.

De toute façon appliquer certaines propriétés de style sur les éléments body (et html) demande une vérification point par point. Et des solutions de remplacement ou "par défaut".
Merci clb56, ça me triturait le cerveau au final cet usage de padding ou de margin sur le body. Même si au final l'usage des margin semble "illogique" bien que ce soit surement le mieux à faire.