Results 1 to 4 of 4

Thread: Understanding <br /> behavior

  1. #1

    Thread Starter
    Addicted Member
    Join Date
    Nov 2006
    Posts
    154

    Understanding <br /> behavior

    As per my understanding <br /> puts the line break where its inserted but please check my following code and I have put <br > at the end of the table but instead of putting line break and then displaying next table after line break its inserting line break at the top of the table where its put.

    HTML Code:
    <style type="text/css">
    table.contacts
    { width: 580px;
    background-color: #fafafa;
    border: 1px #000000 solid;
    border-collapse: collapse;
    border-spacing: 0px; 
    }
    
    
    td.contactDept
    { background-color: #99CCCC;
    border: 1px #000000 solid;
    font-family: Verdana;
    font-weight: bold;
    font-size: 12px;
    color: #404040; }
    
    
    td.contact
    { border-bottom: 1px #6699CC dotted;
    text-align: left;
    font-family: Verdana, sans-serif, Arial;
    font-weight: normal;
    font-size: .7em;
    color: #404040;
    background-color: #fafafa;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 8px;
    padding-right: 0px; }
    </style>
    <table class="contacts" cellspacing="0" summary="Contacts template">
    <tr>
    <td class="contactDept" colspan="3">Our Staff</td>
    </tr>
    <tr>
    <td class="contact" width="25%"><a href="mailto:mail@domain.com">Bob Smith</a></td>
    <td class="contact" width="60%">Director</td>
    <td class="contact" width="15%">567-1234</td>
    </tr>
    <tr>
    <td class="contact"><a href="mailto:mail@domain.com">Jon Doe</a></td>
    <td class="contact">Assistant Director of Assisting the Assistant Planner</td>
    <td class="contact">567-1234</td>
    </tr>
    <tr>
    <td class="contact"><a href="mailto:mail@domain.com">Becky Jones</a></td>
    <td class="contact">Administrative Assistant</td>
    <td class="contact">567-1234</td></tr><br />
    </table>
    
    <table class="contacts" cellspacing="0" summary="Contacts template">
    
    <tr>
    <td class="contactDept" colspan="3">Our Staff</td>
    </tr>
    <tr>
    <td class="contact" width="25%"><a href="mailto:mail@domain.com">Bob Smith</a></td>
    <td class="contact" width="60%">Director</td>
    <td class="contact" width="15%">567-1234</td>
    </tr>
    <tr>
    <td class="contact"><a href="mailto:mail@domain.com">Jon Doe</a></td>
    <td class="contact">Assistant Director of Assisting the Assistant Planner</td>
    <td class="contact">567-1234</td>
    </tr>
    <tr>
    <td class="contact"><a href="mailto:mail@domain.com">Becky Jones</a></td>
    <td class="contact">Administrative Assistant</td>
    <td class="contact">567-1234</td></tr>
    </table>
    Where I am doing mistake?

  2. #2
    Freelancer akhileshbc's Avatar
    Join Date
    Jun 2008
    Location
    Trivandrum, Kerala, India
    Posts
    7,652

    Re: Understanding <br /> behavior

    Hi,

    Try placing it after the closing tag of the table. ie, after the following line:
    Code:
    </table>

    If my post was helpful to you, then express your gratitude using Rate this Post.
    And if your problem is SOLVED, then please Mark the Thread as RESOLVED (see it in action - video)
    My system: AMD FX 6100, Gigabyte Motherboard, 8 GB Crossair Vengance, Cooler Master 450W Thunder PSU, 1.4 TB HDD, 18.5" TFT(Wide), Antec V1 Cabinet

    Social Group: VBForums - Developers from India


    Skills: PHP, MySQL, jQuery, VB.Net, Photoshop, CodeIgniter, Bootstrap,...

  3. #3

    Thread Starter
    Addicted Member
    Join Date
    Nov 2006
    Posts
    154

    Re: Understanding <br /> behavior

    I did it already and it worked on purpose but I wanted to understand the behavior in the situation posted above to understand the logic.

  4. #4
    Frenzied Member
    Join Date
    Apr 2009
    Location
    CA, USA
    Posts
    1,516

    Re: Understanding <br /> behavior

    The situation you've posted is invalid; you can't put a <br/> there, so in order to have a valid DOM, the browser moves it to an acceptable location when rendering your markup.

Posting Permissions

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



Click Here to Expand Forum to Full Width