HTML CSS img en top et en bottom
Résolu/Fermé
George
-
1 mars 2008 à 12:11
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 7 mars 2008 à 00:24
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 7 mars 2008 à 00:24
A voir également:
- HTML CSS img en top et en bottom
- Img burn - Télécharger - Gravure
- Editeur html - Télécharger - HTML
- Html download - Télécharger - HTML
- Br html ✓ - Forum Webmastering
- Retour à la ligne css - Forum CSS
9 réponses
Ululo
Messages postés
28
Date d'inscription
mercredi 5 mars 2008
Statut
Membre
Dernière intervention
31 décembre 2008
7
5 mars 2008 à 12:53
5 mars 2008 à 12:53
Plutôt que de faire un tableau avec tes images,
Fais un div à l'intérieur du premier comme ça ça ne dépassera pas.
HTML:
CSS :
Fais un div à l'intérieur du premier comme ça ça ne dépassera pas.
HTML:
<div id="bloc"> <div id="images"> <img src="images/image1.png" alt=""/><br> sjfejzfjezfjlzejflkzjfezj <img src="images/image2.png" alt=""/><br> sjfejzfjezfjlzejflkzjfezj </div> </div>
CSS :
#images{
align:center;
}
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
920
6 mars 2008 à 12:31
6 mars 2008 à 12:31
salut,
suis bien d'accord pour les <div> !
par contre même avec un tableau le contenu ne devrait pas "glisser" sous le pied de page.
tu n'as pas du flottement ('float') quelque part ?
suis bien d'accord pour les <div> !
par contre même avec un tableau le contenu ne devrait pas "glisser" sous le pied de page.
tu n'as pas du flottement ('float') quelque part ?
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
920
1 mars 2008 à 12:55
1 mars 2008 à 12:55
salut,
tes images sont décoratives ?
la taille de l'image elle-même, mieux vaut ne pas la modifier.
mais tu peux emboiter deux <div> et appliquer une image de fond à chacun, l'une en haut à gauche et l'autre en bas à droite.
tes images sont décoratives ?
la taille de l'image elle-même, mieux vaut ne pas la modifier.
mais tu peux emboiter deux <div> et appliquer une image de fond à chacun, l'une en haut à gauche et l'autre en bas à droite.
Slt,
merci de votre aide, je vous ai fait un screen qui pourra peut-etre vous aidez :
http://img217.imageshack.us/img217/6025/imgio5.jpg
https://imageshack.com/
comment faire avec un div pour définir un top et un bottom ? merci
merci de votre aide, je vous ai fait un screen qui pourra peut-etre vous aidez :
http://img217.imageshack.us/img217/6025/imgio5.jpg
https://imageshack.com/
comment faire avec un div pour définir un top et un bottom ? merci
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
920
3 mars 2008 à 14:12
3 mars 2008 à 14:12
salut,
c'est foutu, le mec est trop musclé !
-:oDDD
nan, j'rigole !
tu dois utiliser un {float:left;}, si oui il faut appliquer un {clear:left;} à l'élément qui vient après dans ton document HTML pour annuler le flottement précédent et revenir dans le flux de positionnement normal.
en fait, tes images doivent être dans un <div>, non ?
si elles sont dans un <div> et que après il n'y a rien d'autre dans le <div> tu peux ajouter une ligne que tu masquera mais qui servira à nettoyer le flottement.
HTML
CSS
mais mieux vaudrait peut être nous montrer tes codes HTML et CSS (seulement ce qui sert) car pour le moment on parle dans le vide, lol !
à plus
c'est foutu, le mec est trop musclé !
-:oDDD
nan, j'rigole !
tu dois utiliser un {float:left;}, si oui il faut appliquer un {clear:left;} à l'élément qui vient après dans ton document HTML pour annuler le flottement précédent et revenir dans le flux de positionnement normal.
en fait, tes images doivent être dans un <div>, non ?
si elles sont dans un <div> et que après il n'y a rien d'autre dans le <div> tu peux ajouter une ligne que tu masquera mais qui servira à nettoyer le flottement.
HTML
<div>
<!-- LES IMAGES -->
<hr id="clearleft">
</div>
CSS
hr#clearleft
{
clear:left;
visibility:hidden;
}
mais mieux vaudrait peut être nous montrer tes codes HTML et CSS (seulement ce qui sert) car pour le moment on parle dans le vide, lol !
à plus
Salut merci.
Alors dans mon css j'ai ceci :
#bloc {
width:898px;
height:422px;
padding:5px 10px;
text-align:left;
background:url(img/bloc.jpg) no-repeat;
}
et ensuite dans mon html je met le contenu de la page dans ma balise :
<div id="bloc">
<center>
<table>
<tr><td>
<img src="images/image1.png" alt=""/></td><td> sjfejzfjezfjlzejflkzjfezj</td></tr>
<tr><td>
<img src="images/image2.png" alt=""/></td><td> sjfejzfjezfjlzejflkzjfezj</td></tr>
</table>
</center>
</div>
Voila pour l'image donnée plus haut par exemple.
Merci
Alors dans mon css j'ai ceci :
#bloc {
width:898px;
height:422px;
padding:5px 10px;
text-align:left;
background:url(img/bloc.jpg) no-repeat;
}
et ensuite dans mon html je met le contenu de la page dans ma balise :
<div id="bloc">
<center>
<table>
<tr><td>
<img src="images/image1.png" alt=""/></td><td> sjfejzfjezfjlzejflkzjfezj</td></tr>
<tr><td>
<img src="images/image2.png" alt=""/></td><td> sjfejzfjezfjlzejflkzjfezj</td></tr>
</table>
</center>
</div>
Voila pour l'image donnée plus haut par exemple.
Merci
Merci mais j'ai résolu mon problème en mixant quelques idées, j'ai une image en top de mon div "contenu" donc j'avais le haut, ensuite j'ai mi une couleur en background donc ça s'adapte selon le contenu de ma page.
et j'ai mis mon image de bottom dans mon footer, et ça se superpose parfaitement donc problème résolu pour moi.
et j'ai mis mon image de bottom dans mon footer, et ça se superpose parfaitement donc problème résolu pour moi.
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
920
7 mars 2008 à 00:24
7 mars 2008 à 00:24
oki !
je coche "résolu", bon courage pour la suite !
je coche "résolu", bon courage pour la suite !
