Reputation: 397
Basically I want to control the margin on the left of the list. Here's how I have it structured:
<li>
<a href="http://link.com">Main</a>
<ul>
<li>
<a href="http://link.com" title="">Sub1</a>
</li>
<li>
<a href="http://link.com" title="">Sub2</a>
</li>
</ul>
</li>
The sub-sections are too far to the right with the current style I'm using. How do I change it?
Upvotes: 3
Views: 182
Reputation: 15653
You need to add class attribute to the sublist:
<li>
<a href="http://link.com">Main</a>
<ul class="sublist">
<li>
<a href="http://link.com" title="">Sub1</a>
</li>
<li>
<a href="http://link.com" title="">Sub2</a>
</li>
</ul>
</li>
And put this css for it:
ul.sublist{
margin-left:20px;
}
Upvotes: 0
Reputation: 449803
My ul "reset" looks something like this:
ul { list-style-type: none; margin: 0; padding: 0 }
Upvotes: 1
Reputation: 1063
You want to remove or at least lessen the margin/padding.
li ul { padding: 0; margin: 0 }
li ul li { padding: 0; margin: 0; }
This should make it flush with the main section list items, adjust to taste.
Upvotes: 0