Sujet Précédent Sujet Suivant

Bloc div HTML

Fermé
Jorge - 4 déc. 2008 à 20:38
 Jorge - 6 déc. 2008 à 17:27
Bonjour,

enfaite j ai 2 blox div l'un a cote de l autre et j'aimerai que les 2 soit de taille égale, mais il ne faut pas une taille fixe et je ne sais pas comment faire, qulqun a t il une idee ?
A voir également:

7 réponses

Réponse 1 / 7
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
4 déc. 2008 à 20:51
Tu peux le faire en CSS.
Tu met 
<div class="###">

Tu remplace ### par ce que tu veux.
Dans la feuille de style: 
div.###{width:#valeur#px;}

Tu remplace #valeur# par une valeur numérique qui correspondra à ta largeur. Les deux div ayant le même class="" auront la même largeur.

Toutefois, si tu veux une largeur non fixe, tu peux remplacer #valeur#px par #valeur#% en ayant un pourcentage à la place (j'ai jamais testé personnellement, donc je sais pas ce que ça peu donner). Je vois en tout cas pas comment faire autrement.
0
Jorge
4 déc. 2008 à 21:27
sa existe pas une instruction qui lui dirait de copier la valeur que prend le bloc voisin, comme sa il s ajuste en fonction de l'autre ...
0
Réponse 2 / 7
Jorge
4 déc. 2008 à 21:28
enfaite c un block qui fait office de menu et l autre de corps, je me ss inspirer du siteduzero :p mais voila j aimerai que le menu s ajuste en fonction du corps
0
Réponse 3 / 7
warlix Messages postés 1201 Date d'inscription mercredi 25 juillet 2007 Statut Contributeur Dernière intervention 21 février 2009 288
4 déc. 2008 à 21:41
salut

tu as essayé de faire un width en % ou dans le genre ,
avec un margin auto ou center machin truc , dsl je n ai plus ouvert une page de code depuis un an :) trop occupé
0
Jorge
4 déc. 2008 à 21:54
no no sa marche pas trop comme je voudrais ...

ou alor si je creeai 2 bloc ds le corps en supprimant le menu, et que je reforme un nv corps et un nv menu, il serai de mm taille ?
0
Réponse 4 / 7
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
5 déc. 2008 à 05:14
Peux tu nous mettre ton code actuel?
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 7
warlix Messages postés 1201 Date d'inscription mercredi 25 juillet 2007 Statut Contributeur Dernière intervention 21 février 2009 288
5 déc. 2008 à 12:29
moi je vois un truc du genre

<div id="corps">

<div class="menu"></div]
<div class="xxxx"></div>
</div]

dans le css
un float left du menu et un réglage en % des deux .class
le div corps si besoin un réglage de la même maniére
de ce que je comprend , tu veux avoir deux bloc de même largeur suivant la résolution de l'écran?
essais de faire un 47% en gros , évite les 50 % qui peuvent être mal interprétés par IE suivant si tu as un bord etc..

Mais oui pose ton code ici
0
Réponse 6 / 7
Jorge
6 déc. 2008 à 16:10
Donc voila le HTML et y a le CSS qui suit :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link type="text/css" rel="stylesheet" href="../style.css">
</head>
<body>
<div id="en_tete">
<img src="../image/b.jpg" alt="Banniere du site">
</div>

<div id="menu">
<ul class=style_lien_menu>
<li><a href="www.google.be">- Lien</a></li>
<li><a href="page1.html">- Lien</a></li>
<li><a href="page1.html">- Lien</a></li>
<li><a href="page1.html">- Lien</a></li>
<li><a href="page1.html">- Lien</a></li>
<li><a href="page1.html">- Lien</a></li>
<li><a href="page1.html">-Lien</a></li>
</ul>

</div>

<div id="corps">
<h1 class="titre">Accueil</h1>
<img class="image_grande"src="../image/JO_Atlanta_1996_-_Boxe.jpg"alt="JO Atlanta 1996">


</div>
</body>
</html>
------------------------------------------------------
Le CSS :

body
{
width: 760px;
margin: auto; /* Pour centrer notre page */
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-bottom: 20px; /* Idem pour le bas du navigateur */
background-color: black;
}

/* L'en-tête */

#en_tete
{
width: 700px;
height: 100px;
margin-bottom: 10px;
margin-left: 90px;/*Pour que la banniere soit alignee avec le corps*/
}
#menu
{
float: left; /* Le menu flottera à gauche */
width: 120px; /* Très important : donner une taille au menu */
background-color: #B60000;
border: 2px solid white;
margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
overflow:auto;

}


.style_lien_menu{
margin-left:6px;
font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif;
list-style-type: none;

}

.titre{
text-align:center;
font-family: Arial;
}

.image_grande{
width: 300px;
align:center;
}

#corps
{
margin-left: 140px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: white;
background-color: #B60000; /* Une couleur de fond pour le corps */
border: 2px solid white; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}




a:link {
color: #FFFFFF;
text-decoration: none;
}

a:visited {
text-decoration: none;
color: #CCCCCC;
}
a:hover {
text-decoration: underline;
color: #000000;
}
a:active {
text-decoration: none;
color: #FF0000;
}
0
Réponse 7 / 7
Jorge
6 déc. 2008 à 17:27
SVP j'ai besoin d'aide, y a til vraiment personne ?
0

Discussions similaires

&nbsp ; Quelle Fonction ?
-Jeff- -
sl4ck -

14 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse
la balise <br> ou <br />
faamugol -
rwaness -

8 réponses
Image cliquable dans html
pau -
efS -

5 réponses
<br> ou <br /> ou </br>
corentin.93 -
jessy006 -

11 réponses