Nederlands Ondersteuningsforum :
Wilt u reageren op dit bericht? Maak met een paar klikken een account aan of log in om door te gaan.

Tables in het index bericht

2 plaatsers

Vorige onderwerp Volgende onderwerp Ga naar beneden

Opgeloste Topic Tables in het index bericht

Bericht van CCDragon ma 29 jun 2015 - 17:36

Hee iedereen,

Ik ben op het moment bezig met het indelen van mijn index bericht, maar kom er niet uit. Ik gebruik de code uit dit topic, maar die staat pontificaal in het midden:
Tables in het index bericht 2cfpjyu

Ik had er graag nog dingen naast willen plaatsen, dus probeerde ik een table er omheen te bouwen. De code bestaat echter al uit heel veel tables en de code raakt in de war. Kan iemand mij helpen om de code zo te bouwen dat de gymleiders aan de linker kant staan en ik nog twee kolommen ernaast heb aan de rechterkant?

Dit is de huidige code:
Code:
<span style="font-family: mistral, script, georgia;font-size: 35px;"> Gymleiders</span><br />  <style type="text/css">.infohover {opacity: 0; padding-top: 0px;  transition: opacity .5s ease-in-out;  -moz-transition: opacity .5s ease-in-out;  -webkit-transition: opacity .5s ease-in-out; }.infohover:hover {opacity: 0.8; padding-top: 0px; transition: opacity .5s ease-in-out;  -moz-transition: opacity .5s ease-in-out;  -webkit-transition: opacity .5s ease-in-out; }</style>    
<table>
                                
 <tbody>
                                            
 <tr>
                                            
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://r12.imgfast.net/users/1212/23/43/92/avatars/1-23.png); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Admin                      
 </div>
                       Brendon Mayon                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                                                            
 <td>
                      
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://r12.imgfast.net/users/1212/23/43/92/avatars/3-54.jpg); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Mod                      
 </div>
                       Mitsu Hotaka                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                      
 </td>
                                                                                  
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://r12.imgfast.net/users/1212/23/43/92/avatars/4-50.png); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Mod                      
 </div>
                       Cynthia Claves                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
 
 </tr>
                                      
 </tbody>
                                      
</table>
                            
<table>
                                            
 <tbody>
                                            
 <tr>
                                            
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://r12.imgfast.net/users/1212/23/43/92/avatars/16-17.jpg); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Mod                      
 </div>
                       Kane Hayashi                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                                                  
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://r12.imgfast.net/users/1212/23/43/92/avatars/15-99.jpg); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Mod                      
 </div>
                       Kean Hayashi                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                  
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://i59.tinypic.com/wvo6le.gif); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       Mod                      
 </div>
                       Eve Cross                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
          
 </tr>
                                      
 </tbody>
                                      
</table>
                            
<table>
                                            
 <tbody>
                                            
 <tr>
                                        
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://i.imgur.com/iGkpm50.png); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       NPC                      
 </div>
                       Sigal Porferio                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                                            
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://i.imgur.com/3ltg5jj.png); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       NPC                      
 </div>
                       Takumi Yuuki                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                    
 <td>
                                            
 <div style="width: 71px; height: 75px; padding: 2px; background-color: none; border: 0px solid #8f8e8c;">
                                            
 <div style="width: 71px; height: 75px; background-image: url(http://i.imgur.com/hnfi6oD.png); background-position: center; margin-top: 0px;">
                                            
 <div class="infohover">
                                            
 <div style="width: 67px; height: 71px; padding: 2px; background-color: #ffffff; position: relative; top: 0px; opacity: 0.9;">
                                            
 <div style="width: 63px; height: 67px; font-family: arial; color: #000000; font-size: 9px; text-transform: uppercase; font-weight: lighter; text-align: center;">
                                            
 <div style="width: 61px; height: 15px; background-color: #000; padding: 5px; margin-left: -2px; margin-top: 10px; font-family: georgia; color: #fff; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; text-align: center;">
                       NPC                      
 </div>
                       Aiko Himura                      
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </div>
                                            
 </td>
                                                                    
 </tr>
                                            
 </tbody>
  
</table>
 

Versie: phpBB2
Browser: Google Crome
CSS aangepast: Ja
Templates aangepast: Ja

EDIT
Ah, ik ben er al uit. Ik heb een code van een andere forum van mij gebruikt en het werkt nu zoals ik het wil n.n Voor wie geïnteresseerd is, zo ziet het eruit:
Tables in het index bericht 24v1fle
Het plaatje bovenaan is wat misleidend, aangezien er who is online op staat, maar ik had gewoon even gauw een plaatje gepakt. Het is dus echt het index bericht :p

En dit is de code. Let op, dit is de kale code. Mijn plaatjes etc. staan er niet in.
Code:
<center>
       <br />      
 <table border="1" bordercolor="#F0FFF0" cellpadding="10" cellspacing="0" style="width: 800px;">
            
 <tbody>
            
 <tr>
            
 <td bgcolor="#F0FFF0">
      
 <!--         By Choco of the IFSZ         -->      
 <div class="tableborder">
            
 <div id="upperBoard" class="maintitle">
            
 <center>
            
 <table>
            
 <tbody>
            
 <tr>
            
 <td>
            
 <center>
BALK BOVENAAN
 </center>
            
 </td>
            
 </tr>
            
 </tbody>
            
 </table>
            
 </center>
            
 </div>
            
 <table cellspacing="1" cellpadding="4" style="width: 100%; height: 150px;">
            
 <tbody>
            
 <tr style="height: 20px;">
            
 <th class="titlemedium" style="width: 35%;">
TITEL LINKS
 </th>
            
 <th class="titlemedium" style="width: 30%;">
TITEL MIDDEN
 </th>
            
 <th class="titlemedium" style="width: 35%;">
TITEL RECHTS
 </th>
            
 </tr>
            
 <tr>
            
 <td class="row2" style="text-align:center;">
TEKST VAK 1 [LINKS]      
 </td>
            
 <td class="row4" style="text-align:center;">
TEKST VAK 2 [MIDDEN]
              
 </td>
            
 <td class="row2" style="text-align:center;">
TEKST VAK 3 [RECHTS]      
 </td>
            
 </tr>
            
 </tbody>
            
 </table>
                    
 </div>
      
 </td>
      
 </tr>
      
 </tbody>
      
 </table>
</center>

Terug naar boven Terug naar beneden

CCDragon

CCDragon
Actief Forumlid

Vrouw
Berichten : 365
Leeftijd : 31
Registratie : 24-12-12
Oprichter : Ja
Templates : Ja
CSS : Ja

Lid sinds +10 jaar
U bent al meer dan 10 jaar lid
200 berichten of meer gepost
Je hebt 200 berichten of meer gepost
Feestdagen 2022
Fijne Feestdagen namens team Actieforum!
Oud Actieforum Medewerker
Deze gebruiker is een oud Actieforum medewerker.
Feestdagen 2023
Fijne Feestdagen namens team Actieforum!

http://kanto-experience.actieforum.com



CCDragon is bedankt door de starter van dit topic.

Opgeloste Topic Re: Tables in het index bericht

Bericht van 10spetter10 do 2 jul 2015 - 18:28

Ik had dit topic al eens gezien maar ik had het uitgesteld omdat ik niet op mijn computer zat, daarna was ik het even vergeten.

Ik ben wel blij om te zien dat je het ondertussen al zelf hebt kunnen oplossen. Smile

.Tables in het index bericht Hurhad10.Ondersteunings Vraag opgelost en gesloten.

Terug naar boven Terug naar beneden

10spetter10

10spetter10
Superactief Forumlid

Man
Berichten : 1222
Leeftijd : 27
Registratie : 08-07-12
Oprichter : Ja
Templates : Ja
CSS : Ja

Lid sinds +10 jaar
U bent al meer dan 10 jaar lid
1000 berichten of meer gepost
Je hebt 1000 berichten of meer gepost
Feestdagen 2022
Fijne Feestdagen namens team Actieforum!
Oud Actieforum Medewerker
Deze gebruiker is een oud Actieforum medewerker.
Feestdagen 2023
Fijne Feestdagen namens team Actieforum!




10spetter10 is bedankt door de starter van dit topic.

Vorige onderwerp Volgende onderwerp Terug naar boven

- Soortgelijke onderwerpen

Permissies van dit forum:
Je mag geen reacties plaatsen in dit subforum