28172 sujets

CSS et mise en forme, CSS3

Superposer (??) 2 images

Bonjour,

j'essaie d'apprendre (par la force des choses) à modifier une feuille de style afin d'obtenir ce que je veux, à savoir afficher 2 images l'une par-dessus l'autre. La première est un bandeau uniforme, la 2ème une icône. Voici les div dans lesquels je peux intervenir:

(Fait partie d'une CSS nommée Structure.css)
-----------------------------------------------------
div.sub {
border-bottom:1px solid rgba(50, 50, 50, 0.35);
min-height:18px;
padding:1px 27px;
}


(Fait partie d'une CSS nommée Style.css)
------------------------------------------------
#Calendar .sub {
background-image:url(../images/content_body.png);
background-repeat:repeat-y;
}

Content_body est le bandeau de fond et j'ai besoin de mettre dans div.sub l'icône qui est un png d'une dizaine de pixels de côtés.
Petite précision, je suis archi nulle en css... Et pour être tout à fait précise, il s'agit de la modification de l'affichage d'informations sur le lockscreen de mon iphone gérés par un fichier html:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="strings/en.js"></script>
<script type="text/javascript" src="config.js"></script>
<link rel="stylesheet" type="text/css" href="css/structure.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="background">
<div id="lockinfo"></div>
<div id="bottom"></div>
</div>
<script type="text/javascript" src="js/prototypes.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<script type="text/javascript" src="js/plist.js"></script>
<script type="text/javascript" src="js/lockinfo.js"></script>
<script type="text/javascript" src="js/weather.js"></script>
<script type="text/javascript" src="js/init.js"></script>
<script type="text/javascript" src="debug.js"></script>
</body>
</html>

J'ai réussi à modifier tout ce que je voulais grâce à firebug,, sauf,, ces 2 images à superposer et là, je sèche.
Quelqu'un peut-il m'aider?

1dessin valant mieux que des mots, en image mon souci,, évidemment c'est un montage, sinon je ne serais pas ici...
http://img34.imageshack.us/img34/7514/img0022u.png
Le bandeau en question est le(s) rectangles gris, l'icône, la petit horloge en noir et blanc (à côté du rectangle rouge)
Modifié par parisienne17 (22 Jun 2009 - 11:46)
Hello parisienne17 et bienvenue Smiley smile ,

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace après le crochet ouvrant).

upload/1-code.gif

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que l'Aide (dont le lien est fourni lors de l'inscription) contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.

Bonne continuation Smiley smile
Merci pour ce message qui n'aurait pas eu de raison d'être si, lorsque j'ai sélectionné mon texte et cliqué sur le bouton code, quelque chose s'était passé....
Donc, pour respecter la charte sus nommée,j'ai édité à la main avec les Smiley codes [/code] qui le font.

Bonne continuation aussi.
Si les icones en question sont les icones "soleil", "nuage"... ellest doivent se trouver dans le HTML avec un texte alternatif qui va bien.
Hi Laurie-Anne,, non l'icône en question est la petite horloge située juste à gauche de l'encadré en rouge sur l'image. Cette partie est bien sur gérée par une feuille css grâce au code qui est dans mon texte.

Merci pour ta réponse.
Sujet clos
Aller à