如何调整水平线

Question

我正在尝试制作一个移动应用程序，但是设计一个页面在每个段后面都有一行但是现在它不会出现在上面的那个地方（参见代码）可以有人帮我一样。

代码：

HTML：

<div class="main_paragraph">
    <p><b><h3>Mode of notification</h3></p></b><p id="p1">Select mode of     notification</p>
</div>

<div>
    <div id="row11"><img id="msg" src="http://megaicons.net/static/img/icons_sizes/8/60/256/basic-message-icon.png" alt="message_icon"><p id="p2"> 
&nbsp&nbsp&nbsp Email </p></div>
        <div id="row12"><div id="p3"><select name="flip-3" id="flip-3" data-role="slider" data-mini="true">
        <option value="off">Off</option>
        <option value="on">On</option>
            </select><div></div><br>

  <div class="h_line"></div>       
              <div id="row21"><img id="img2" src="https://cdn4.iconfinder.com/data/icons/epic-outlines/30/message-512.png" alt="message_icon"><p id="p2"> 
&nbsp&nbsp&nbsp SMS</p></div>
        <div id="row22"><div id="p3"><select name="flip-3" id="flip-3" data-role="slider" data-mini="true">
        <option value="off">Off</option>
        <option value="on">On</option>
            </select><div></div><br>

            </div>


            <div class="main_paragraph1">
    <p><b><h3>Display Preferences</h3></p></b><p id="p11">Select the default landing page</p>
</div>
<div class="h_line_big"></div>
<div id="sub">
    <div id="row31"><img id="msg1" src="https://cdn3.iconfinder.com/data/icons/unicons-vector-icons-pack/32/large-thumbnails-512.png" alt="message_icon"><p id="p12"> 
&nbsp&nbsp&nbsp Analytics</p></div>
        <div id="row32"><div id="p34"><div></div><br>

  <div class="h_line"></div>       
              <div id="row41"><img id="img3" src="https://cdn4.iconfinder.com/data/icons/miu/24/circle_backup_time_history_recent_time-machine_-128.png" alt="message_icon"><p id="p21"> 
&nbsp&nbsp&nbsp Timeline</p></div>
        <div id="row42"><div id="px"><img id="dot" src="https://cdn3.iconfinder.com/data/icons/objects/512/Dot-128.png" alt="dot"></div>
            </div>

CSS：

.main_paragraph {
    margin-left:5%;

}

#p1 {
    margin-top:-10px;
    position:relative;
}
#msg
{   padding-top:15px;
    height:20px;
    width:25px;
    margin-left:10%;
     float:left;

}
#p2
{   text-shadow: none;
    display-block:inline;

}
#row11
{float:left;  
  margin-top:25px;
  width:70%;
  height:100px;

}

#row12
{   float:right; 
    display-block:inline;

    height:100px;
    width:30%;
    margin-top:25px;
}
#p3
{
    padding-bottom:10px;
}
.h_line 
{   width:100%;
    height:1px; 
    background: black;
    position: absolute;
    left: 0;   
    background:black;
}
#row21
{    position:absolute;
    float:left;
    margin-top:25px;
    left:0;
    display-block:inline;
    width:70%;

}
#row22
{    float:left;
    display-block:inline;
    margin-right:30px;
    margin-top:25px;
}
#img2

{   padding-top:15px;
    height:20px;
    width:25px;
    margin-left:10%;
     float:left;
}

.h_line_big
{
    width:100%;
    height:7px; 
    background: #CCCCCC;
    position: absolute;
    left: 0;   

}
.main_paragraph1 {
    margin-top:15px;
    margin-left:5%;
    position:absolute;
    left:0;

}

#p11 {
    margin-top:-10px;
    position:relative;
}
#msg1
{   padding-top:15px;
    height:20px;
    width:25px;
    margin-left:10%;
     float:left;

}
#p12
{   text-shadow: none;
    display-block:inline;

}
#row31
{
    position:absolute;
    float:left;
    margin-top:25px;
    left:0;
    display-block:inline;
    width:70%;

}

#row32
{   float:left; 
    display-block:inline;

    height:100px;
    width:30%;
    margin-top:25px;
}
#p34
{
    padding-bottom:10px;
}
.h_line 
{   width:100%;
    height:1px; 
    background: black;
    position: absolute;
    left: 0;   
    background:black;
}
#row41
{    position:absolute;
    float:left;
    margin-top:25px;
    left:0;
    display-block:inline;
    width:100%;

}
#row42
{    float:left;
    display-block:inline;
    margin-right:10px;
    margin-top:25px;

}
#img3
{   padding-top:15px;
    height:20px;
    width:25px;
    margin-left:10%;
     float:left;
}
#sub {
    margin-top:100px;
}
#dot
{   margin-left:10px;
    margin-top:10px;

    height:20px;
    width:20px;
}

.h_line1
{
    width:100%;
    height:1px; 
    top:52px;
    background: black;
    position: absolute;
    left: 0;   
    background:black;
}
#px
{
    padding-bottom:10px;
    min-height:10px;
}

http://jsfiddle.net/tvaibhav/w3wbksb6/2/