Alignement des prédéfinis et du staff

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Alignement des prédéfinis et du staff

Message par Dellou le Jeu 8 Mai 2014 - 20:10

Bonjour/Bonsoir forumactif ! ^^
Voilà, il se trouve que j'ai un problème :nansansblague:
J'aimerais aligner mes prédéfinis au staff !
Malheureusement, même en utilisant td ou en tripatouillant, les prédéfinis s'aligne à côté de mon image…Urg.



Le code HTML de ma PA :

Spoiler:

Code:
<center>
    <img border="0" alt="" src="http://img11.hostingpics.net/pics/974309AAzz.png" />
</center>
<div style="border: 1 solid; width: 660px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px;">
    <span style="text-shadow: black 0px 0px 3px;"><span style="color:#00acec;"><span style="font-family: Impact;"><span style="font-size: 24px; line-height: normal"> <a href="#">Réglement </a><a></a><a href="#">Intrigue</a><a></a><a href="#"> Crédits</a><a></a><a href="#"> Partenariats</a><a href="#"> Prédéfinis</a> </span></span></span> </span>
</div>
 
<table border="0">
   
   <tbody>
      
      <tr>
         
         <td center="" align="">
            
         </td>
         
      </tr>
      
      <tr>
         
         <td>
            
            <blockquote style="display: block; width: 400px; height: 200px;box-shadow: 0px 0px 50px #00e3f9;border-radius: 10px; overflow: auto;background-color: #c1d901;">
                <span style="font-size: 11px"> Faut écrire le contexte ici quand on l'aura fini comme ça bah les gens ils comprendrons qu'c'est un forum fondés par deux trisomiques qui recherche des amis comme des clochardes, mais je me demande si ce n'est pas un complot monté contre la congoloxicomatisation des lois du marché. C'est un coup des émeus. <a href="#"> Suite</a></span>
            </blockquote>
            
         </td>
         
         <td>
             <img src="http://img15.hostingpics.net/pics/93838238Z.png" alt="" border="0" />
         </td>
         
      </tr>
      
   </tbody>
</table>
 
<div style="position:relative;left:-30px">
   
   <div style="border: 1 solid; width: 200px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px;">
       <span style="text-shadow: black 0px 0px 3px;"><span style="color:#00acec;"><span style="font-family: Impact;"><span style="font-size: 24px; line-height: normal"> Staff <br /><span style="font-size: 13px;color:#f8bb01;">vénérés et adulés de tous, évidement. HA.HA.</span></span></span></span> </span>
   </div>
   
</div>
<table>
   
   <tbody>
      
   </tbody>
</table>
<table>
   
   <tbody>
      
      <tr>
         
         <td>
            
            <div class="contenant">
               
               <div class="contenu">
                   TEXTE DERRIERE L'IMAGE
               </div>
                <img src="http://www.hostingpics.net/thumbs/71/61/72/mini_716172SengokuBeasara600962501.jpg" />
            </div>
            
         </td>
         
         <td colspan="2">
            
            <div class="contenant">
               
               <div class="contenu">
                   TEXTE DERRIERE L'IMAGE
               </div>
                <img src="http://www.hostingpics.net/thumbs/71/61/72/mini_716172SengokuBeasara600962501.jpg" />
            </div>
            
         </td>
         
      </tr>
      
   </tbody>
   
</table>
 
<div style="border: 1 solid; width: 200px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px;">
    <span style="text-shadow: black 0px 0px 3px;"><span style="color:#00acec;"><span style="font-family: Impact;"><span style="font-size: 24px; line-height: normal"> Prédéfinis </span></span></span> </span>
</div>
 
<table>
   
   <tbody>
      
      <tr>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
      </tr>
      
      <tr>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
         <td class="predef_td">
             <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>
         </td>
         
      </tr>
      
   </tbody>
   
</table>

Pourriez-vous m'aider ? ;x;


Dernière édition par Dellou le Sam 10 Mai 2014 - 1:22, édité 1 fois

Dellou
**

Féminin
Messages : 92
Inscrit(e) le : 06/10/2012

http://black-deal.monforumgratuit.com/
Dellou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement des prédéfinis et du staff

Message par Dellou le Ven 9 Mai 2014 - 12:07

Up QAQ

Dellou
**

Féminin
Messages : 92
Inscrit(e) le : 06/10/2012

http://black-deal.monforumgratuit.com/
Dellou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement des prédéfinis et du staff

Message par MlleAlys le Ven 9 Mai 2014 - 13:24

Bonjour,
quelque chose comme ça ?
Code:
<center>
    <img border="0" alt="" src="http://img11.hostingpics.net/pics/974309AAzz.png" />
</center>
<div style="border: 1 solid; width: 660px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px; text-shadow: black 0px 0px 3px;color:#00acec;font-family: Impact;font-size: 24px; line-height: normal"> <a href="#">Réglement </a>  <a href="#">Intrigue</a>  <a href="#">Crédits</a>  <a href="#"> Partenariats</a>  <a href="#">Prédéfinis</a>
</div>
<table border="0">
    <tbody>
        <tr>
            <td>
                <blockquote style="display: block; width: 400px; height: 200px;box-shadow: 0px 0px 50px #00e3f9;border-radius: 10px; overflow: auto;background-color: #c1d901;font-size: 11px; padding:10px;">Faut écrire le contexte ici quand on l'aura fini comme ça bah les gens ils comprendrons qu'c'est un forum fondés par deux trisomiques qui recherche des amis comme des clochardes, mais je me demande si ce n'est pas un complot monté contre la congoloxicomatisation des lois du marché. C'est un coup des émeus. <a href="#"> Suite</a>

                </blockquote>
            </td>
            <td>
                <img src="http://img15.hostingpics.net/pics/93838238Z.png" alt="" border="0" />
            </td>
        </tr>
    </tbody>
</table>
<div style="display:inline-block; vertical-align:top; margin:10px;">
    <div style="border: 1 solid; width: 200px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px;">
        <div style="text-shadow: black 0px 0px 3px; color:#00acec; font-family: Impact; font-size: 24px; line-height: normal">Staff</div>
        <div style="text-shadow: black 0px 0px 3px; font-family: Impact; font-size: 13px;color:#f8bb01;">vénérés et adulés de tous, évidement. HA.HA.</div>
    </div>
    <br/>
    <table>
        <tbody>
            <tr>
                <td>
                    <div class="contenant">
                        <div class="contenu">TEXTE DERRIERE L'IMAGE</div>
                        <img src="http://www.hostingpics.net/thumbs/71/61/72/mini_716172SengokuBeasara600962501.jpg" />
                    </div>
                </td>
                <td colspan="2">
                    <div class="contenant">
                        <div class="contenu">TEXTE DERRIERE L'IMAGE</div>
                        <img src="http://www.hostingpics.net/thumbs/71/61/72/mini_716172SengokuBeasara600962501.jpg" />
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div style="display:inline-block; vertical-align:top; margin:10px;">
    <div style="border: 1 solid; width: 200px;background-color:#c1d901;border-radius: 10px 10px 10px 10px; -moz-border-radius-bottomright: 5; -moz-border-radius-bottomleft: 10; -moz-box-shadow: 0px 0px 10px #5e5e5e; box-shadow: 0px 0px 10px #5e5e5e; -webkit-box-shadow: 0px 0px 10px #5e5e5e; padding: 5px;">
        <div style="text-shadow: black 0px 0px 3px; color:#00acec; font-family: Impact; font-size: 24px; line-height: normal">Prédéfinis</div>
    </div>
    <br/>
    <table>
        <tbody>
            <tr>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
            </tr>
            <tr>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
                <td class="predef_td"> <a style="width: 82px; height: 82px;" href=""><img style="width: 82px; height: 82px;" src="" /></a>

                </td>
            </tr>
        </tbody>
    </table>
</div>
J'ai entouré les deux blocs de divs que j'ai affichées en inline-block, ce permet d'en mettre plusieurs sur la même ligne. Vertical-align permet de contrôler le placement des deux blocs sur cette lignes : ici top, les deux blocs ont leur ligne haute à la même hauteur. On peut modifier top par middle ou bottom.

MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement des prédéfinis et du staff

Message par Dellou le Sam 10 Mai 2014 - 1:23

Oh !!! Merci beaucoup c'est exactement ça !
Merci d'avoir pris du temps pour mon problème ! Vraiment ! ♥

Le sujet est résolu ! *-* ☆

Dellou
**

Féminin
Messages : 92
Inscrit(e) le : 06/10/2012

http://black-deal.monforumgratuit.com/
Dellou a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum