Geek asks and answers

How to insert a gap between my list items?

Hi, I want to add space between these two blocks: enter image description here

My current display is almost right, but there is no space between the blocks: enter image description here

The code

<div class="data-box">   
            <div class="personName"><strong>    
                1. Joey Tempest&nbsp;
             </strong></div> 
        <div class="otherDetails"></div> 

        <table border="0"><tr><td></td><td>Telefon</td><td></td></tr>
        <tr><td></td><td>Fax</td><td></td></tr>
        <tr><td></td><td>E-post</td><td></td></tr>
        <tr><td>Sverige                                           </td><td>Referens</td><td></td></tr>
        </table> 


    </div>  

    <div class="clear"></div>
    <div class="fl10"></div>



        <div class="data-box">   
            <div class="personName"><strong>    
                2. Tone Norum&nbsp;
             </strong></div> 
        <div class="otherDetails"></div> 

        <table border="0"><tr><td></td><td>Telefon</td><td></td></tr>
        <tr><td></td><td>Fax</td><td></td></tr>
        <tr><td></td><td>E-post</td><td></td></tr>
        <tr><td>Sverige                                           </td><td>Referens</td><td></td></tr>
        </table> 


    </div>

I can only insert a <br>, and then a space will appear. This is a good decision? enter image description here

+3
source share
3 answers

No, adding is <br />not a good solution. You must provide margin-bottom to your div data files:

div.data-box{
    margin-bottom: 10px;
}

If you want the last div to not have a field, you can also define it.

The fiddle works here (sorry for the lack of a descriptor, you did not specify the css code). http://jsfiddle.net/DCuKm/1/

+3
source

Add margin to your divison.

.data-box {
    margin-bottom: 10px;
}
+1

, div data-box.

.

div.data-box {
    margin-bottom: 5px;
}

, , , , .

. http://jsfiddle.net/6PZnC/

+1
source

More articles:


All Articles