Placez un calque en dessous d'un autre

Placez un calque en dessous d'un autre - HTML/CSS - Programmation

Marsh Posté le 26-02-2005 à 16:02:36    

Bonjour à tous !
Voilà ma situation :
3 blocs côtes-à-côtes espacés.
http://www.alsacreations.com/articles/div/img4.gif
 
Je voudrais placer un bloc4 juste en dessous du bloc 1, 2, ou 3.
 
Malgré moultes tentatives : rien à faire !  
Je suis désespéré  :??: , j'attends vos réponses !Merci!

Reply

Marsh Posté le 26-02-2005 à 16:02:36   

Reply

Marsh Posté le 26-02-2005 à 16:08:57    

personnelement j'ai pas fait bac V :o


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 26-02-2005 à 16:15:05    

????  :??:

Reply

Marsh Posté le 26-02-2005 à 16:22:05    

donne ton code, je sais pas le deviner moi :o


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 26-02-2005 à 16:29:00    

<br />
ou bien les css.
et si t'utilise les tableaux (c'est mal mais c'est souvent cette méthode qu'est choisit) il suffit de faire une nouvelle ligne.


Message édité par omega2 le 26-02-2005 à 16:29:19
Reply

Marsh Posté le 26-02-2005 à 16:35:07    

Dsl msieurs ! :)  
 

Code :
  1. <div id="bloc1" class="profil" style="float:left;background-image:url(img/images/transparent.gif);border-top:1px black solid;border-left:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  2.   <span class="info"><a href="index.php?page=gere&amp;mod=news">Mes news</a></span>
  3. </div>
  4. <div id="bloc2" class="profil" style="float:left;background-image:url(img/images/transparent.gif);border-top:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  5.   <span class="info"><a href="index.php?page=gere&amp;mod=commentaires">Mes commentaires</a></span>
  6. </div>
  7. <div id="bloc3" class="profil" style="float:left;background-image:url(img/images/transparent.gif);border-top:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  8.   <span class="info"><a href="index.php?page=gere&amp;mod=liens">Mes liens</a></span>
  9. </div>


Voilà le code et il faut que je place un div sous le bloc1, 2 ou 3...

Reply

Marsh Posté le 26-02-2005 à 16:39:30    

omega2 a écrit :

<br />
ou bien les css.
et si t'utilise les tableaux (c'est mal mais c'est souvent cette méthode qu'est choisit) il suffit de faire une nouvelle ligne.


Je me suis mal expliqué : il faut que le bloc ait les mêmes dimensions  que le bloc sous lequel il se place et juste sous un seul(pas les trois en même temps)  ;) .

Reply

Marsh Posté le 26-02-2005 à 16:41:02    

omega2 a écrit :

<br />
ou bien les css.
et si t'utilise les tableaux (c'est mal mais c'est souvent cette méthode qu'est choisit) il suffit de faire une nouvelle ligne.


Je me suis mal expliqué : il faut que le bloc ait les mêmes dimensions  que le bloc sous lequel il se place et juste sous un seul(pas les trois en même temps)  ;) .

Reply

Marsh Posté le 26-02-2005 à 17:12:28    

Ben tu mets tous tes blocs dans un div contenant. Tu lui donne une taille, puis apres tu "faits mumuse" avec float sur les les blocs que tu veux.
Tu peux aussi utiliser "clear: both" si tu veux "forcer" un "passage a la ligne".

Reply

Marsh Posté le 26-02-2005 à 17:40:01    

le problème est que je ne donne pas de taille aux divs concernés  :pt1cable:

Reply

Marsh Posté le 26-02-2005 à 17:40:01   

Reply

Marsh Posté le 26-02-2005 à 18:58:28    

ben si tu spéciie aucune taille, que le contenu est de taille variable et que t'as besoin que le div de la seconde ligne ai exactement la taille du premier de la premiére ligne .... et ben tu vas t'amuser. Moi dans de telles conditions, je vois pas de solution.

Reply

Marsh Posté le 26-02-2005 à 19:22:30    

Citation :

Moi dans de telles conditions, je vois pas de solution.


Idem, d'où mon post  ;) .
C'est pas grave, j'ai opté pour une solution plus simple.

Code :
  1. <div>
  2.     <div class="profil" style="float:left;<?php if(trim($mod) != 'news') echo 'background-image:url(img/images/transparent.gif);'; ?>border-top:1px black solid;border-left:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  3.         <span class="info"><a href="index.php?page=gere&amp;mod=news">Mes news</a></span>
  4.     </div>
  5.     <div class="profil" style="float:left;<?php if(trim($mod) != 'commentaires') echo 'background-image:url(img/images/transparent.gif);'; ?>border-top:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  6.        <span class="info"><a href="index.php?page=gere&amp;mod=commentaires">Mes commentaires</a></span>
  7.     </div>
  8.     <div class="profil" style="float:left;<?php if(trim($mod) != 'liens') echo 'background-image:url(img/images/transparent.gif);'; ?>border-top:1px black solid;border-right:1px black solid;text-align:left;padding:3px;">
  9.         <span class="info"><a href="index.php?page=gere&amp;mod=liens">Mes liens</a></span>
  10.     </div>
  11.     <div class="profil" style="clear:both;background-image:url(img/images/transparent.gif);border:1px black solid;">
  12.         <div class="gere">Pas de rubrique sélectionnée</div>
  13.     </div>
  14. </div>


Merci à tous pour vos réponses !  :)

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed