CSS dépassement de bordure sur Firebox
Qrazy
Messages postés
5
Statut
Membre
-
Ssylvainsab Messages postés 2892 Statut Modérateur -
Ssylvainsab Messages postés 2892 Statut Modérateur -
Bonjour,
Je viens de me lancer dans le CSS, donc autant vous dire que je suis une véritable débutante.
J'ai un souci entre IE et Firebox : j'ai différents éléments sur la gauche d'un cadre puis sur la droite un élément que je positionne par float: right. Selon la longueur de ce dernier, mon cadre s'aggrandit sur IE mais pas sur Firebox. Du coup cet élément dépasse la bordure du bas... pas très esthétique.
Quelqu'un aurait ma solution ?
Vous remerciant,
Qrazy.
Je viens de me lancer dans le CSS, donc autant vous dire que je suis une véritable débutante.
J'ai un souci entre IE et Firebox : j'ai différents éléments sur la gauche d'un cadre puis sur la droite un élément que je positionne par float: right. Selon la longueur de ce dernier, mon cadre s'aggrandit sur IE mais pas sur Firebox. Du coup cet élément dépasse la bordure du bas... pas très esthétique.
Quelqu'un aurait ma solution ?
Vous remerciant,
Qrazy.
A voir également:
- CSS dépassement de bordure sur Firebox
- Bordure de page word - Guide
- Bordure excel ne s'affiche pas ✓ - Forum Excel
- Ajouter bordure photo ✓ - Forum MacOS
- Le logiciel amd a détecté un dépassement de délai du pilote - Forum Carte graphique
- Dépassement de capacité vba ✓ - Forum Excel
4 réponses
Bonjour.
Est-ce que tu peux donner ton code html et CSS, ou mieux, une adresse web ou l'on pourrait voir ?
a plus
Est-ce que tu peux donner ton code html et CSS, ou mieux, une adresse web ou l'on pourrait voir ?
a plus
Re-Bonsoir.
Je ne vois pas de quel élément tu veux parler.
Les éléments ne se chevauchent pas, car tu as défini des tailles fixes (ce qui est déconseillé), donc si on réduit la fenêtre en largeur au dessous d'un certain seuil on doit scroller horizontalement, et la page est fixe.
Donne plus de détails :
quel est l'élément qui pose problème, que contient-il, etc.
Quelques conseils :
-Utilises des tailles relatives (en % pour tes blocs)
-"Raccourcis" un peu tes CSS.
Par exemple,
border-style:solid;border-width:3px;border-color:green;
devient
border:3px solid green;
Je pense surtout à tes backgrounds :
background-image:url('monimage');
background-position:left center;
background-repeat:no-repeat;
devient :
background:url('monimage') no-repeat left center;
-Evite d'utiliser des caractères spéciaux dans tes fichiers : seulement des lettres (les 26 de l'alphabet, sans accents, cédilles, etc) en minuscules, des chiffres, des underscores _ ou des tirets.
a plus
Je ne vois pas de quel élément tu veux parler.
Les éléments ne se chevauchent pas, car tu as défini des tailles fixes (ce qui est déconseillé), donc si on réduit la fenêtre en largeur au dessous d'un certain seuil on doit scroller horizontalement, et la page est fixe.
Donne plus de détails :
quel est l'élément qui pose problème, que contient-il, etc.
Quelques conseils :
-Utilises des tailles relatives (en % pour tes blocs)
-"Raccourcis" un peu tes CSS.
Par exemple,
border-style:solid;border-width:3px;border-color:green;
devient
border:3px solid green;
Je pense surtout à tes backgrounds :
background-image:url('monimage');
background-position:left center;
background-repeat:no-repeat;
devient :
background:url('monimage') no-repeat left center;
-Evite d'utiliser des caractères spéciaux dans tes fichiers : seulement des lettres (les 26 de l'alphabet, sans accents, cédilles, etc) en minuscules, des chiffres, des underscores _ ou des tirets.
a plus
Si tu regardes la page "liens" dans mon site, sur IE toutes les bannières sont comprises dans mon cadre. Par contre dans Firefox, une grande partie des bannières dépassent le cadre du bas. J'aimerais solutionner ce pb.
En tout cas, merci pour tes infos. Je me bats toute seule avec un bouquin & je ne possède aucune formation en informatique... du coup pas toujours évident !
En espérant une réponse.
Bonne soirée,
Qrazy.
En tout cas, merci pour tes infos. Je me bats toute seule avec un bouquin & je ne possède aucune formation en informatique... du coup pas toujours évident !
En espérant une réponse.
Bonne soirée,
Qrazy.
Tu peux t'en sortir en utilisant :
overflow:scroll;
max-height:800px;
sur ton div#banniere
Mais je te le répètes :
-Tu ne dois pas utiliser deux éléments avec le même id. C'est interdit. A la place utilise l'attribut class;
Ensuite, en css tu utilises un point au lieu d'un dièze :
.banniere //les elements de classe "bannierre"
-Tu ne devrais pas utiliser des tailles fixes (en pixels).
C'est gênant et contraignant.
Utilises plutôt des tailles relatives, en % (voir les liens donnés plus haut).
a plus
overflow:scroll;
max-height:800px;
sur ton div#banniere
Mais je te le répètes :
-Tu ne dois pas utiliser deux éléments avec le même id. C'est interdit. A la place utilise l'attribut class;
Ensuite, en css tu utilises un point au lieu d'un dièze :
.banniere //les elements de classe "bannierre"
-Tu ne devrais pas utiliser des tailles fixes (en pixels).
C'est gênant et contraignant.
Utilises plutôt des tailles relatives, en % (voir les liens donnés plus haut).
a plus
Je ne comprends pas, à quel moment je dois utiliser class ?
Partout ou tu utilises plusieurs fois le même id.
Par exemple tes p#banniere, change les en p.banniere.
Dans le code html, <p id="banniere"> devient <p class="banniere">
Peux-tu me donner 2/3 explications concernant les tailles fixes (px) & relatives (%) ?
Tu sais ce qu'est un pixel (px) ?
En gros c'est un point de ton écran.
Il ne vaut mieux pas les utiliser car c'est une taille fixe, comme les centimètres.
Il faut utiliser les pourcents, comme ca les blocs s'adapteront à la taille de la fenêtre de ton visiteur.
En plus, elles sont "dynamiques".
C'est à dire que si l'on redimensionne la fenêtre, les blocs s'adapteront.
Si ca casse ton design lorsqu'un bloc est trop petit, tu peux utiliser l'attribut min-width.
Ca définit une taille minimale pour un bloc.
On peut aussi utiliser max à la place de min et height à la place de width.
Par exemple, si tu définis ce style pour un bloc :
width:75%;
min-width:200px;
min-height:300px;
Ton bloc prendra 75% de la fenêtre.
mais si on réduit trop la fenêtre en largeur, il fera 200 pixels, et si on la réduit trop en hauteur, il fera 300 pixels.
Tu peux utiliser ca si tu a des images qui doivent être placées d'une certaine façon.
Pour les tailles de polices (font-size), utilises des em.
1em correspond à une hauteur de ligne.
Et c'est dans le navigateur que l'on définit la taille d'une hauteur de ligne en pixels.
Comme ca, la taille du texte sera adapté à celle du visiteur.
Pour résumer :
Utilises de % pour tes blocs, ou des pixels s'ils ne contiennent que des images (ou une majorité d'images)
Utilise des em pour la taille du texte.
a plus
Partout ou tu utilises plusieurs fois le même id.
Par exemple tes p#banniere, change les en p.banniere.
Dans le code html, <p id="banniere"> devient <p class="banniere">
Peux-tu me donner 2/3 explications concernant les tailles fixes (px) & relatives (%) ?
Tu sais ce qu'est un pixel (px) ?
En gros c'est un point de ton écran.
Il ne vaut mieux pas les utiliser car c'est une taille fixe, comme les centimètres.
Il faut utiliser les pourcents, comme ca les blocs s'adapteront à la taille de la fenêtre de ton visiteur.
En plus, elles sont "dynamiques".
C'est à dire que si l'on redimensionne la fenêtre, les blocs s'adapteront.
Si ca casse ton design lorsqu'un bloc est trop petit, tu peux utiliser l'attribut min-width.
Ca définit une taille minimale pour un bloc.
On peut aussi utiliser max à la place de min et height à la place de width.
Par exemple, si tu définis ce style pour un bloc :
width:75%;
min-width:200px;
min-height:300px;
Ton bloc prendra 75% de la fenêtre.
mais si on réduit trop la fenêtre en largeur, il fera 200 pixels, et si on la réduit trop en hauteur, il fera 300 pixels.
Tu peux utiliser ca si tu a des images qui doivent être placées d'une certaine façon.
Pour les tailles de polices (font-size), utilises des em.
1em correspond à une hauteur de ligne.
Et c'est dans le navigateur que l'on définit la taille d'une hauteur de ligne en pixels.
Comme ca, la taille du texte sera adapté à celle du visiteur.
Pour résumer :
Utilises de % pour tes blocs, ou des pixels s'ils ne contiennent que des images (ou une majorité d'images)
Utilise des em pour la taille du texte.
a plus
je suis éleveur de =^..^=
Merci d'avance :-)