Jump to content

CSS list appearing outside of DIV?


cs.punk

Recommended Posts

CSS

div.sidebar {
margin: 30px;
margin-right: 0px;
padding: 5px;
padding-left: 0px;
border: none;
float: left;
overflow: auto;
text-align: left;
}

.roundedcornr_box {
   background: #1C7AFF;
   margin: 30px;
   margin-left: 370px;
   
}
.roundedcornr_top div {
   background: url(roundedcornr_tl.png) no-repeat top left;
}
.roundedcornr_top {
   background: url(roundedcornr_tr.png) no-repeat top right;
}
.roundedcornr_bottom div {
   background: url(roundedcornr_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom {
   background: url(roundedcornr_br.png) no-repeat bottom right;
}

.roundedcornr_top div, .roundedcornr_top, 
.roundedcornr_bottom div, .roundedcornr_bottom {

   height: 30px;
   font-size: 18px;
}

#list-table {
	margin: 20px;
padding: 0; 
text-align: center;
width: 800px;
   background-color: #4486B5;
   border: solid;
   border-color: black;
   float: left;
   list-style: none;
   margin-bottom: 20px;
}

#list-table li {
border-bottom: 2px solid black;
padding: 2px 20px;
}

#list-table li.last 
{border-bottom:none;
}

 

html

<body>

<div class='sidebar'>

..... (bla bla)

</div>

<div class="roundedcornr_box">
   <div class="roundedcornr_top"><div></div></div>
      <div class="roundedcornr_content">
  
<h1>Guestbook</h1>
<br/>

<ul id='list-table'>
<li><p class='table'><span class='yellow'>Example 1</span>
<span class='grey'>(17 - February 2010 : 10:51 am)</span>:
<br />
test
</p></li>
<li><p class='table'><span class='yellow'>Example 2</span>
<span class='grey'>(17 - February 2010 : 10:51 am)</span>:
<br />
test
</p></li>
<li><p class='table'><span class='yellow'>Example 3</span>
<span class='grey'>(17 - February 2010 : 10:51 am)</span>:
br />
test
</p></li>
</ul>

      </div>
   <div class="roundedcornr_bottom"><div></div></div>
</div>

</body>

 

 

Attached a screen shot too..

 

I just can't figure it out?? And i bet its something really simple.. :confused:

 

[attachment deleted by admin]

Link to comment
https://forums.phpfreaks.com/topic/192356-css-list-appearing-outside-of-div/
Share on other sites

I got it!

 

CSS

#list-table {
	margin: 20px;
padding: 0; 
text-align: center;
width: 800px;
   background-color: #4486B5;
   border: solid;
   border-color: black;
[s]   float: left;   [/s]                                          // <--- HERE
   list-style: none;
   margin-bottom: 20px;
}

 

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.