Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder Partizan's Avatar
    Join Date
    Dec 2008
    Location
    Legoland and Ireland
    Posts
    139
    Thanks
    74
    Thanked 0 Times in 0 Posts

    layout with divs and table

    I would like to have my screen consisting of 2 divs, one on the left will contain a table and the one of the right a picture with text below.

    This is my code but as you can see on http://www.minifigtimes.com/football.shtml the table is not positioned to the left of the image but below it. Anyone know what's wrong?

    PHP Code:

      
    <h4 class="story-headline-top">Football</h4>      
        
        <
    div class="img right" style="border: 0px solid black; padding: 20px; float: right; width: 250px; max-width: 250px;">

          <
    a href="#" style="display: block;">
             <
    img src="images-2009/news/2009-02-09-p1.png" alt="United on form">
          </
    a

              <
    p style="width: 100%;">  
             
    Legoland United have now hit top form... insert more text insert more text insert more text insert more text insert more text   
              
    </p>
              

         </
    div>
      
    <
    p>  



    <
    style>.ltrack font-family"calibri"font-size10pt ; }</style>

    <
    table border="1" width="100%" cellspacing="3" cellpadding="1" class="ltrack">


    <
    tr>
       <
    th>Team</th>
       <
    th>P</th>
       <
    th>W</th>
       <
    th>D</th>
       <
    th>L</th>

       <
    th>F</th>
       <
    th>A</th>
       <
    th>GD</th>
       <
    th>Points</th>
    </
    tr>


    <
    tr>
       <
    td>Ajax Skerries</td>

       <
    td align="right">28</td>
       <
    td align="right">15</td>
       <
    td align="right">8</td>
       <
    td align="right">5</td>
       <
    td align="right">30</td>
       <
    td align="right">16</td>

       <
    td align="right">14</td>
       <
    td align="right">53</td>
    </
    tr>
    <
    tr>
       <
    td>Legoland FC</td>
       <
    td align="right">28</td>
       <
    td align="right">14</td>

       <
    td align="right">9</td>
       <
    td align="right">5</td>
       <
    td align="right">43</td>
       <
    td align="right">20</td>
       <
    td align="right">23</td>
       <
    td align="right">51</td>

    </
    tr>
    <
    tr>
       <
    td>Legoland United</td>
       <
    td align="right">28</td>
       <
    td align="right">14</td>
       <
    td align="right">8</td>
       <
    td align="right">6</td>

       <
    td align="right">47</td>
       <
    td align="right">20</td>
       <
    td align="right">27</td>
       <
    td align="right">50</td>
    </
    tr>
    <
    tr>
       <
    td>Republic</td>

       <
    td align="right">28</td>
       <
    td align="right">13</td>
       <
    td align="right">10</td>
       <
    td align="right">5</td>
       <
    td align="right">24</td>
       <
    td align="right">17</td>

       <
    td align="right">7</td>
       <
    td align="right">49</td>
    </
    tr>
    <
    tr>
       <
    td>Port Villa</td>
       <
    td align="right">28</td>
       <
    td align="right">13</td>

       <
    td align="right">7</td>
       <
    td align="right">8</td>
       <
    td align="right">28</td>
       <
    td align="right">26</td>
       <
    td align="right">2</td>
       <
    td align="right">46</td>

    </
    tr>
    <
    tr>
       <
    td>Black Fortress Barbarians</td>
       <
    td align="right">28</td>
       <
    td align="right">12</td>
       <
    td align="right">9</td>
       <
    td align="right">7</td>

       <
    td align="right">30</td>
       <
    td align="right">20</td>
       <
    td align="right">10</td>
       <
    td align="right">45</td>
    </
    tr>
    <
    tr>
       <
    td>Emperor Eagles</td>

       <
    td align="right">28</td>
       <
    td align="right">12</td>
       <
    td align="right">7</td>
       <
    td align="right">9</td>
       <
    td align="right">23</td>
       <
    td align="right">23</td>

       <
    td align="right">0</td>
       <
    td align="right">43</td>
    </
    tr>
    <
    tr>
       <
    td>Juventus</td>
       <
    td align="right">28</td>
       <
    td align="right">9</td>

       <
    td align="right">11</td>
       <
    td align="right">8</td>
       <
    td align="right">24</td>
       <
    td align="right">22</td>
       <
    td align="right">2</td>
       <
    td align="right">38</td>

    </
    tr>
    <
    tr>
       <
    td>Inter Police</td>
       <
    td align="right">28</td>
       <
    td align="right">10</td>
       <
    td align="right">8</td>
       <
    td align="right">10</td>

       <
    td align="right">26</td>
       <
    td align="right">25</td>
       <
    td align="right">1</td>
       <
    td align="right">38</td>
    </
    tr>
    <
    tr>
       <
    td>Parma</td>

       <
    td align="right">28</td>
       <
    td align="right">9</td>
       <
    td align="right">10</td>
       <
    td align="right">9</td>
       <
    td align="right">23</td>
       <
    td align="right">22</td>

       <
    td align="right">1</td>
       <
    td align="right">37</td>
    </
    tr>
    <
    tr>
       <
    td>Lazio</td>
       <
    td align="right">28</td>
       <
    td align="right">9</td>

       <
    td align="right">9</td>
       <
    td align="right">10</td>
       <
    td align="right">22</td>
       <
    td align="right">26</td>
       <
    td align="right">-4</td>
       <
    td align="right">36</td>

    </
    tr>
    <
    tr>
       <
    td>Fiorentina</td>
       <
    td align="right">28</td>
       <
    td align="right">7</td>
       <
    td align="right">13</td>
       <
    td align="right">8</td>

       <
    td align="right">23</td>
       <
    td align="right">22</td>
       <
    td align="right">1</td>
       <
    td align="right">34</td>
    </
    tr>
    <
    tr>
       <
    td>Napoli</td>

       <
    td align="right">28</td>
       <
    td align="right">7</td>
       <
    td align="right">13</td>
       <
    td align="right">8</td>
       <
    td align="right">25</td>
       <
    td align="right">26</td>

       <
    td align="right">-1</td>
       <
    td align="right">34</td>
    </
    tr>
    <
    tr>
       <
    td>Roma</td>
       <
    td align="right">28</td>
       <
    td align="right">8</td>

       <
    td align="right">10</td>
       <
    td align="right">10</td>
       <
    td align="right">22</td>
       <
    td align="right">26</td>
       <
    td align="right">-4</td>
       <
    td align="right">34</td>

    </
    tr>
    <
    tr>
       <
    td>Marino</td>
       <
    td align="right">28</td>
       <
    td align="right">8</td>
       <
    td align="right">9</td>
       <
    td align="right">11</td>

       <
    td align="right">31</td>
       <
    td align="right">27</td>
       <
    td align="right">4</td>
       <
    td align="right">33</td>
    </
    tr>
    <
    tr>
       <
    td>Legoland Town</td>

       <
    td align="right">28</td>
       <
    td align="right">8</td>
       <
    td align="right">9</td>
       <
    td align="right">11</td>
       <
    td align="right">17</td>
       <
    td align="right">29</td>

       <
    td align="right">-12</td>
       <
    td align="right">33</td>
    </
    tr>
    <
    tr>
       <
    td>Greentown Athletic</td>
       <
    td align="right">28</td>
       <
    td align="right">7</td>

       <
    td align="right">10</td>
       <
    td align="right">11</td>
       <
    td align="right">23</td>
       <
    td align="right">35</td>
       <
    td align="right">-12</td>
       <
    td align="right">31</td>

    </
    tr>
    <
    tr>
       <
    td>Celebs</td>
       <
    td align="right">28</td>
       <
    td align="right">7</td>
       <
    td align="right">9</td>
       <
    td align="right">12</td>

       <
    td align="right">19</td>
       <
    td align="right">24</td>
       <
    td align="right">-5</td>
       <
    td align="right">30</td>
    </
    tr>
    <
    tr>
       <
    td>Inter</td>

       <
    td align="right">28</td>
       <
    td align="right">7</td>
       <
    td align="right">9</td>
       <
    td align="right">12</td>
       <
    td align="right">19</td>
       <
    td align="right">31</td>

       <
    td align="right">-12</td>
       <
    td align="right">30</td>
    </
    tr>
    <
    tr>
       <
    td>Lion Lakers</td>
       <
    td align="right">28</td>
       <
    td align="right">7</td>

       <
    td align="right">6</td>
       <
    td align="right">15</td>
       <
    td align="right">31</td>
       <
    td align="right">49</td>
       <
    td align="right">-18</td>
       <
    td align="right">27</td>

    </
    tr>
    <
    tr>
       <
    td>Torino</td>
       <
    td align="right">28</td>
       <
    td align="right">6</td>
       <
    td align="right">8</td>
       <
    td align="right">14</td>

       <
    td align="right">13</td>
       <
    td align="right">25</td>
       <
    td align="right">-12</td>
       <
    td align="right">26</td>
    </
    tr>
    <
    tr>
       <
    td>Robin Rangers</td>

       <
    td align="right">28</td>
       <
    td align="right">5</td>
       <
    td align="right">10</td>
       <
    td align="right">13</td>
       <
    td align="right">16</td>
       <
    td align="right">28</td>

       <
    td align="right">-12</td>
       <
    td align="right">25</td>
    </
    tr>
    </
    table>

    </
    p

    My CSS:

    PHP Code:
    body{
      
    background-colorwhite;
      
    margin-left:15%;
      
    margin-right15%;
      
    font-size:80%;                
      
    font-family:"calibri"           
    }

    h1h2h3 {
      
    color#000; 
      
    font-weight:normal;
      
    font-stylenormal;
      
    text-decorationnone;
      
    margin-left0;
      
    margin-bottom0;
    }

    h1{font-size400%;}
    h2{font-size300%;}
    h3{font-size200%;}
    h4{font-size175%;}
    h5{font-size150%;}
    h6{font-size125%;}

    br {font-size100%;}

    {
    font-size100%;
    }









    /* Fillers */

    .break {margin:1em 0;}

    .
    story-headline {margin:3em 0 0 0;} /* above left below right */
    .story-headline-top {margin:6em 0 0 0;} /* above left below right */
    .p-space-removed {margin:0 0 0 0;} /* above left below right */
    .news-links-top {margin:8em 0 0 0;} /* above left below right */
    .footer {margin:9em 0 0 0;} /* above left below right */








    .blue-bold {
      
    colorblue
      
    font-weight:bold;
      
    font-stylenormal;
      
    text-decorationnone;
      
    margin-left0;
      
    margin-bottom0;
    }


    .
    ltrack font-family"calibri"font-size10pt ; }



    /* Hyperlinks - General */

    .link-blue font-family"calibri"font-size10pt colorblue ; }
    .
    link-blue:link {text-decorationnone}
    .
    link-blue:visited {text-decorationnonecolorblue;}
    .
    link-blue:active {text-decorationnone}
    .
    link-blue:hover {text-decorationunderlinecolorblue;}



    /* Hyperlinks - General */
    .tablelink1 font-family"calibri"font-size10pt colorblue ; }
    .
    tablelink1:link {text-decorationnone}
    .
    tablelink1:visited {text-decorationnone}
    .
    tablelink1:active {text-decorationnone}
    .
    tablelink1:hover {text-decorationunderlinecolorred;}







    a img {
      
    border0;
    }





    /* Main story images and text placement underneath*/

    .right{
      
    floatright;

    .
    img{
      
    border1px solid black;
      
    padding20px;
    }
    .
    right a, .left a{
      
    displayblock;

    .
    left p, .right p{
      
    width100%;
    }

    /* End */ 

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Not sure, but try
    Code:
    .ltrack {/*football.shtml (line 148)*/
    font-family:"calibri";
    font-size:10pt;
    display:block;
    margin-right:260px;
    }
    Oh.. well, get rid of all errors in your markup first, before expecting the desired output, see http://validator.w3.org/check?uri=ht...Inline&group=0
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder Partizan's Avatar
    Join Date
    Dec 2008
    Location
    Legoland and Ireland
    Posts
    139
    Thanks
    74
    Thanked 0 Times in 0 Posts
    Thanks - that is an improvement but now the image looks like its in the table too..

    I cannot get rid of the errors, bar the odd removal of some <br> tags as the html for all the tables is imported from an application that produces the html code in this old format..

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Quote Originally Posted by Partizan View Post

    I cannot get rid of the errors, bar the odd removal of some <br> tags as the html for all the tables is imported from an application that produces the html code in this old format..
    It sounds like your using the wrong DocType then. Try this instead:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #5
    Regular Coder Pepe, the bull's Avatar
    Join Date
    Feb 2005
    Location
    Vancouver, WA
    Posts
    163
    Thanks
    1
    Thanked 16 Times in 16 Posts
    I think its a width issue. Try making your table's ltrack class only 500px.
    Pepe, the bull


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •