Pb de dimensionnement d'image avec div et css
boudz
-
Enax Messages postés 203 Date d'inscription Statut Membre Dernière intervention -
Enax Messages postés 203 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je crée un site web avec divisions en div (une bannière en haut, le corps de la page divisé verticalement entre le menu à gauche et le contenu à droite ; et en bas le pied de page).
Rien de très compliqué, sauf que je souhaite insérer des boutons ds la division "menu", et qu'ils dépassent de la largeur de la div de gauche! Je voudrais que ces boutons s'adaptent à la taille de la div (selon la résolution de l'ecran) pour ne pas empiéter sur la div du contenu.
Pour info, mes div menu et contenu sont configurées comme cela pour la largeur (ds la css):
20% pour le menu
80% pour le contenu
voici mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Granada, capital cultural</title>
</head>
<body>
<div id="bandeau"> <img src="../images/banniere.jpg"> </div>
<div id="menu"> <a href="accueil.html"> <img src="../images/accueil.jpg"> </a> </div>
<div id="contenu">Ceci est le contenu</div>
<div id="pied_page"> <a href="mailto:***@hotmail.com"> cliquez ici pour me contacter </a>
</div>
</body>
</html>
et ma css :
div {
text-align:center;
}
div#bandeau {
width:750px;
height:140px;
margin: 0 auto;
background-color:#FFFFFF;
}
div#menu {
float:left;
width:20%;
background-color:#FF6699;
}
div#contenu {
float:left;
width:80%;
background-color:#FFCC00;
}
div#pied_page {
clear:both;
width:100%;
height:50px;
background-color:#FFFFFF;
}
A {
color:#ad241c;
text-decoration:none;
}
A:hover {
color:#ad241c;
text-decoration:underline;
}
Merci de votre réponse !
Boudz
je crée un site web avec divisions en div (une bannière en haut, le corps de la page divisé verticalement entre le menu à gauche et le contenu à droite ; et en bas le pied de page).
Rien de très compliqué, sauf que je souhaite insérer des boutons ds la division "menu", et qu'ils dépassent de la largeur de la div de gauche! Je voudrais que ces boutons s'adaptent à la taille de la div (selon la résolution de l'ecran) pour ne pas empiéter sur la div du contenu.
Pour info, mes div menu et contenu sont configurées comme cela pour la largeur (ds la css):
20% pour le menu
80% pour le contenu
voici mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Granada, capital cultural</title>
</head>
<body>
<div id="bandeau"> <img src="../images/banniere.jpg"> </div>
<div id="menu"> <a href="accueil.html"> <img src="../images/accueil.jpg"> </a> </div>
<div id="contenu">Ceci est le contenu</div>
<div id="pied_page"> <a href="mailto:***@hotmail.com"> cliquez ici pour me contacter </a>
</div>
</body>
</html>
et ma css :
div {
text-align:center;
}
div#bandeau {
width:750px;
height:140px;
margin: 0 auto;
background-color:#FFFFFF;
}
div#menu {
float:left;
width:20%;
background-color:#FF6699;
}
div#contenu {
float:left;
width:80%;
background-color:#FFCC00;
}
div#pied_page {
clear:both;
width:100%;
height:50px;
background-color:#FFFFFF;
}
A {
color:#ad241c;
text-decoration:none;
}
A:hover {
color:#ad241c;
text-decoration:underline;
}
Merci de votre réponse !
Boudz
A voir également:
- Pb de dimensionnement d'image avec div et css
- Image iso - Guide
- Reduire taille image - Guide
- Acronis true image - Télécharger - Sauvegarde
- Légender une image - Guide
- Combien y a-t-il de bateaux dans la zone de 475 pixels de large et 1000 pixels de haut à partir du coin supérieur gauche de cette image ? - Forum Photoshop