[CSS] [IE] width auto non reconnu
trop-gnon
Messages postés
16
Date d'inscription
Statut
Membre
Dernière intervention
-
trop-gnon Messages postés 16 Date d'inscription Statut Membre Dernière intervention -
trop-gnon Messages postés 16 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
IE Grrrrrrrrrrrrrrrrr!
J'ai un souci avec un bloc div (deux en fait) dont la largeur (identique pour chacun) doit s'adapter au contenu. j'ai ainsi deux blocs div l'un dans l'autre:
mon but est de placer un logo au dessus du texte dynamique.
j'ai fait ça:
.donnees {
position: relative;
font-size: 30px;
font-style: oblique;
color: #990000;
background-color: #000000;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #990000;
border-right-color: #990000;
border-bottom-color: #990000;
border-left-color: #990000;
height: 40px;
margin-top: 60px;
padding-right: 10px;
padding-left: 10px;
width: inherit;
}
.donneeslogo {
color: #990000;
float: right;
position: relative;
top: -82px;
right: 30px;
height: 100px;
margin-bottom: -82px;
background-image: url(../Pics/logomontagne.gif);
background-repeat: no-repeat;
background-position: left bottom;
border: 2px dotted #00CC00;
width: auto;
}
et ça donne ça : http://www.regards.coin-pomme.com/terrephoto.php
La zone concernée est encadrée en pointillés verts.
et bien entendu, ça marche sous FF, mais ça bugg sous IE7 et autres probablement (et il n'y a pas que ça qui bugg sous IE, mais chaque chose en son temps!)
ma version sans logo fonctionnait très bien (pour ce point précis) sous les deux navigateurs, par exemple sur cette page :
http://www.regards.coin-pomme.com/astrophoto.php
Je crois comprendre que mes blocs div (données et donnéeslogo) dont la largeur n'est pas fixée, prend la largeur du premier bloc parent dont la largeur est fixée (ici le bloc "rouge" dont cette dernière est fixée à 780px)
Quelqu'un voit-il une solution, quitte à repenser un peu mes imbrications de bloc div?
Merci d'avance aux âmes charitables jetant un oeil jusqu'au bout ce ce post. Et un énorme MERCI pour celui ou celle qui me lancera sur une piste exploitable.
TG.
PS: j'ai déjà essayé de triturer l'argument du width de mes deux blocs div, plusieurs combinaisons (auto, inherit, voire rien du tout) fonctionnent sous FF, aucune ne fonctionne sous IE! (IE Grrrrrrrrrrrr!)
IE Grrrrrrrrrrrrrrrrr!
J'ai un souci avec un bloc div (deux en fait) dont la largeur (identique pour chacun) doit s'adapter au contenu. j'ai ainsi deux blocs div l'un dans l'autre:
<div class="donneeslogo" > <div class="donnees" > <?php echo... texte dynamique ; ?> </div> <!-- fin bloc donnees --> </div> <!-- fin bloc donneeslogo -->
mon but est de placer un logo au dessus du texte dynamique.
j'ai fait ça:
.donnees {
position: relative;
font-size: 30px;
font-style: oblique;
color: #990000;
background-color: #000000;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #990000;
border-right-color: #990000;
border-bottom-color: #990000;
border-left-color: #990000;
height: 40px;
margin-top: 60px;
padding-right: 10px;
padding-left: 10px;
width: inherit;
}
.donneeslogo {
color: #990000;
float: right;
position: relative;
top: -82px;
right: 30px;
height: 100px;
margin-bottom: -82px;
background-image: url(../Pics/logomontagne.gif);
background-repeat: no-repeat;
background-position: left bottom;
border: 2px dotted #00CC00;
width: auto;
}
et ça donne ça : http://www.regards.coin-pomme.com/terrephoto.php
La zone concernée est encadrée en pointillés verts.
et bien entendu, ça marche sous FF, mais ça bugg sous IE7 et autres probablement (et il n'y a pas que ça qui bugg sous IE, mais chaque chose en son temps!)
ma version sans logo fonctionnait très bien (pour ce point précis) sous les deux navigateurs, par exemple sur cette page :
http://www.regards.coin-pomme.com/astrophoto.php
Je crois comprendre que mes blocs div (données et donnéeslogo) dont la largeur n'est pas fixée, prend la largeur du premier bloc parent dont la largeur est fixée (ici le bloc "rouge" dont cette dernière est fixée à 780px)
Quelqu'un voit-il une solution, quitte à repenser un peu mes imbrications de bloc div?
Merci d'avance aux âmes charitables jetant un oeil jusqu'au bout ce ce post. Et un énorme MERCI pour celui ou celle qui me lancera sur une piste exploitable.
TG.
PS: j'ai déjà essayé de triturer l'argument du width de mes deux blocs div, plusieurs combinaisons (auto, inherit, voire rien du tout) fonctionnent sous FF, aucune ne fonctionne sous IE! (IE Grrrrrrrrrrrr!)
A voir également:
- [CSS] [IE] width auto non reconnu
- Cle usb non reconnu - Guide
- Ie tab - Télécharger - Outils pour navigateurs
- Ciel auto entrepreneur - Télécharger - Comptabilité & Facturation
- Auto clicker souris - Télécharger - Divers Utilitaires
- Logiciel réparation clé usb non reconnue gratuit - Télécharger - Récupération de données
1 réponse
Bon, j'ai trouvé cette solution :
.donneeslogoDemi-lune {
color: #0066FF;
float: right;
position: relative;
top: -82px;
right: 30px;
height: 100px;
margin-bottom: -82px;
background-image: url(../Pics/logodlune.png);
background-repeat: no-repeat;
background-position: left bottom;
?width: 100px ;
}
l'astuce est située à la dernière ligne : ?width: 100px ;
le "?" permet de donner une instruction seulement pour IE (6 et 7), ce qui corrige mon bug (un de mes bugs)
J'attends un peu avant de fermer le post, au cas ou quelqu'un trouve une solution plus propre.
Merci tout de même, TG.
.donneeslogoDemi-lune {
color: #0066FF;
float: right;
position: relative;
top: -82px;
right: 30px;
height: 100px;
margin-bottom: -82px;
background-image: url(../Pics/logodlune.png);
background-repeat: no-repeat;
background-position: left bottom;
?width: 100px ;
}
l'astuce est située à la dernière ligne : ?width: 100px ;
le "?" permet de donner une instruction seulement pour IE (6 et 7), ce qui corrige mon bug (un de mes bugs)
J'attends un peu avant de fermer le post, au cas ou quelqu'un trouve une solution plus propre.
Merci tout de même, TG.