Set margin for UL and LI : ul « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. ul

Set margin for UL and LI

   




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
.tblcontent p {
 margin: 0;
 padding: 0;
 font-weight: bold;
}
.tblcontent ul {
 margin: 0;
 padding: 0;
}
.tblcontent li {
 margin: 0;
 padding: 0;
 line-height: 1.5;
}
.tblcontent li a {
 padding-left: 15px;
 background: red;
}
</style>
</head>

<body>
  <table>
    <tr>
     <td>
   <div class="tblcontent">
   <p>To-do list on your day off.</p>
   <ul>
     <li><a href="">W</a></li>
     <li><a href="">W</a></li>
     <li><a href="">W</a></li>
    <li>no link.</li>
   </ul>  
  </div>
  </td>
  </tr>
  </table>
</body>

</html>








Related examples in the same category

1.'ul' creates an unordered (bulleted) list
2.UL tag
3.Define class for UL for border (1px solid black) and padding (40px)
4.UL margin left and padding left
5.UL border bottom: 1px solid black
6.UL list style: none
7.UL width: 36%
8.UL text index: -1em
9.UL margin: 0
10.UL padding: 0 0 0 1em
11.Use DIV to wrap a UL
12.Turn off list style
13.Left margin for list
14.Nested UL and LI tags
15.Add style to multi-level UL
16.turns off bullets for multi-level bullets
17.Add alignment line for UL
18.List with background
19.Advanced Lists: nested and ordered
20.ul margin-left: 40px; padding-left: 0px;
21.ul list-style-type: disc; list-style-image: url(bullet.gif);
22.ul padding: 0 0 0 1em;
23.UL width: 1000px;
24.UL float: left;
25.UL margin: 12px 0 1px 0;
26.UL display: block;
27.UL height: 25px;
28.UL LI based menu
29.UL LI based link list
30.UL float: right
31.UL for navigation
32.Setting style for UL inside a DIV
33.ul text-align: center;