Problème de superposition de texte sur image

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Problème de superposition de texte sur image

mims1664

3 / vert

Bonjour,

j'ai ce problème de superposition :
http://www.developpementphoto.net/V3/

sur l'étoile bleu à droite "Gros consommateurs ? profitez des packs photo"

J'ai sur l'image donné cette propriété :

style="float:right; margin:10px; border:0"

mais le texte de la liste dessous superpose l'image alors que j'aimerais un cadre autour de l'image de 10px.
De plus la seconde ligne de la liste a un espace avec le premier élément, ce qui est du a l'image aussi.

Pouvez vous m'aider ?

Edit le résultat n'est pas le même sous internet explorer et firfox. .. je vous laisse voir de vous même.

Merci

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

Publicité

-Swink-

Salut à toi,

Alors déja si tu veux un cadre autour de ton image met plutôt sa :

style="float:right; margin:10px; border:1"

ou sinon tu enlève border:0" car il désactive les bordures ce code

Sinon pour le reste pourraît plus précis je n'arrive pas à tous bien comprendre

Amicalement Swink

---------------
L'amour ne se cherche pas, il éclot au détour d'un regard, au coin d'un sourire

mims1664

3 / vert

bonjour,

non en fait je désire que le texte de la liste contourne l'image, plutot épouse le cadre invisible de l'image afin d'éviter les espaces.
la ca fonctionne sous firefox mais pas internet explorer ..
Une idée ?

Message édité par mims1664 le 25-08-2008 à 19:12:14

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

mIRROR

Chevreuillobolchévik

oui

ton code est crade
il devrait avoir la meme structure sur le papier et sur le web
ton image, le H1 et ta liste devraient etre dans le meme conteneur
tu enleves les styles en ligne de tes li (style="width:xxx" ) parce qu ie cherchera pas a comprendre (il pousse) et normalement ca marche tout seul

edit: arrange toi pour avoir les menus fermés quand on charge la page ca fait pas tres serieux

Message édité par mIRROR le 26-08-2008 à 01:01:55

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

mims1664

3 / vert

ha ben ca c'est facile a dire tout ca ! moi je galère avec la css a croire que je fais un rebus dessus !
le faite de passer la taille du li en auto (car si ne met rien ca descend a gogo sous la side barre) ca me décale le <span class="first"> et le <span class="second"> dans le li !

Message cité 1 fois

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

mIRROR

Chevreuillobolchévik

mims1664 a écrit :

j avais meme pas vu les faux a pour souligner un element [:prozac]
voila en gros, ca marche sur ie6 et ff
pas de styles en ligne tu bloques pas tes elements en pixels il faut les laisser respirer

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
    <title>Test</title>
    <style type="text/css" >
        ul, li {margin:0;padding:0;}
        .section {width:80%;}
        .section h1 {background: url(images/flechetitre.png) no-repeat center left;padding-left:25px;}
        .section .media {float:right;cursor:pointer;margin:30px 0;}
        #listeaccueil  {list-style-type:none;padding-left:20px;}
        #listeaccueil li, #listeaccueil div {overflow:auto;zoom:1;}
        #listeaccueil h3 {float:left;width:20%;margin:0;color:#06f;font-size:15px;text-decoration:underline;}
    </style>
</head>
<body>

<div class="section">
    <img alt="Pack photos" title="Pack photos pour les gros consommateurs de photos" src="images/etoile.png" class="media" />
    
    <h1>Les bons plans photos et les promotions</h1>
    
    <ul id="listeaccueil">
        <li>
            <h3>Les Accros 2 :</h3>
            <div><strong>10 €</strong> les <strong>200 photos</strong> (hors frais de port) </div>
        </li>

        <li>
            <h3>Photobox :</h3>
            <div>40 tirages classic au format 10x15 ou 11x15 et 10 agrandissements format 15x20 ou 15x21 (hors frais de port) </div>
        </li>

        <li>
            <h3> Photoways :</h3>
            <div> <strong>WAYSPRSAUG</strong>&nbsp;3€ de réduction sur le Livre Photo Prestige </div>
        </li>


        <li>
            <h3> Photoways :</h3>
            <div> <strong>WAYSPSTAUG </strong>15 % de réduction sur les posters. </div>
        </li>

        <li>
            <h3> Les Accros 2 :</h3>
            <div><strong>200 </strong>tirages 10x13 à <strong>10 €</strong>, <strong>500 </strong>tirages à <strong>20 €</strong> hors frais de ports</div>
        </li>
    </ul>

</div>  

</body>
</html>

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

mims1664

3 / vert

lol non quand même pas ! les a seront des futures lien !!! LOL

bon j'ai regardé ce que tu as fait ! en effet c'est pas mal mais a la base si tu regarde bien ce qu'il y a en face des laboratoire s'aligne en fonction de la longueur du labo et cela sur 2 lignes si il le faut alors que ce que tu m'as proposé ne s'adapte pas a la longue du texte du labo si demain j'en ai un qui s'appel : blabalbalbalbalbalbabref

bref trop long ca va tout me décaler et se sera pas beau alors qu'avec le système actuel la ou les lignes s'adapteront a sa longueur !
c'est pas simple (a expliquer et a comprendre je pense)

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

mIRROR

Chevreuillobolchévik

si demain t as un nom de labo trop long ca sera un caractere ou deux a changer dans ta css, c est quand meme loin de ressembler a la fin du monde... au moins tu garderas un bel alignement, c ets nettement plus agreable pour ton visiteur
en bonus, tout ce qui est potentiellement modifiable est centré dans une seule css et pas 20 000 styles en ligne qui te feront perdre du temps
mais voila quoi, avant de se mettre a coder tete baissée il faut juste s arreter et prendre un peu de temps pour bien organiser le truc
non seulement tu y gagneras en temps de developpement et je te raconte meme pas le gain en maintenance

Message édité par mIRROR le 27-08-2008 à 18:43:00

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

mims1664

3 / vert

LOL je crois que tu as totalement raison !! et je crois que je perds la raison !! je deviens fou avec cette css !!! LOL
je vais faire 2 ou 3 test ! je te redis ca !

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

mIRROR

Chevreuillobolchévik

pas de probleme
et si t as des question hesite pas

---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell

Publicité

mims1664

3 / vert

ok ok merci mIRROR ;-) bonne soirée a toi !

---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo

FORUM HardWare.fr

Programmation

HTML/CSS

Problème de superposition de texte sur image

Sujets relatifs
problème de AND et OR dans mon select	Problème .h
AS3 : netStream -> afficher la premiere image et mettre sur pause	problème fichier C
Probleme de library	[Résolu] Problème UTF8, l'espace magique.
probleme de compilation	Comment attaquer le probleme php/mysql + chrono ?
xmlhttprequest - problème pour inclure un bout de code	Problème accès au fichier sur le disque...
Plus de sujets relatifs à : Problème de superposition de texte sur image

Page générée en 0.042 secondes