HTML Help

GabrielJordan0891 · Joined: 14 Aug 2008 Posts: 3

Okay, I am just getting back into coding and have been messing around with the html part. I have made a table, one col, two row. However ther is a huge space left of my list that I would like to get rid of and would like to know how it came about. So help for both would be appreciated. I will just give the code from where the table begins.
<table width=15% Rules=none Frame=Void cellspacing="0" cellpadding="0">
<tr BGCOLOR="blue">
<td>Useful Links</td>
</tr>
<tr>
<td>
<ul class="Navbartopleft">
<li><a href="kldjfido">Generator Sizing Guide</a></li>
<li>Rebates</li>
<li>Payment Methods/Discounts</li>
<li>Returns/Cancellation Policy</li>
<li>Shipping Policy</li>
</ul>
</td>
</tr>

sticks464 · Joined: 31 Dec 2006 Posts: 1283

By default list have a margin to the left to display the list-style-type. If you do not want the style to display it can be removed and using negative margin to slide the list back to the left.

This goes in the head section
Code: <style type="text/css">
.Navbartopleft {
margin-left:-40px;/* move list to the left */
list-style:none;/* remove the left style */
}
.Navbartopleft li {
display:block;/* gives each list item it's own space to be styled */
margin:5px 0;/* adds space between each list item */
}
</style>

If you want the round circle next to the list item remove the line
Code: list-style:none;
Now you must reduce the left-margin to accommodate the circle
Code: margin-left:-25px;

GabrielJordan0891 · Joined: 14 Aug 2008 Posts: 3

thank you very much.