Archived

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

  • 0

CSS for unordered list is effecting display of nav menu items


Question

Posted · Report post

page example - http://theresaevans.co.nz/?page_id=25

I am having trouble styling the unordered list in the page content with CSS, when I set the left margin to bring the list in from the left edge, it started effecting the display of the nav bar list items, pushing them further apart and sending some nav page links down to a second line. I would really appreciate soem sugestions on how I can work the CSS to style the list without effecting the list items in the navbar menu.

Share this post


Link to post
Share on other sites

3 answers to this question

Posted · Report post

Hi,

You could do this, wrap some divs around your unordered list and give it a class, see below.


<div class="listy">

Your ul list code here

</div>
[/code] The use the following CSS:
[code]

.listy ul {
list-style-type: disc;
padding-left: 15px;
}

ul li {
padding: 0;
margin: 0;
}

This should resolve your issue.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for the tip - unfortunately it is not working?

Is the html correct?:

<strong>Listen to your story</strong>

<div class="listy">

<ul>

<li>Have the opportunity to speak honestly and openly about your situation</li>

<li>Receive practical and spiritual guidance to help you develop insight on a personal and professional level</li>

</ul>

</div>

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

I have visited your website again and I am not able to see any issue, can you provide a screenshot please, of how you would like it to look and what the issue is.

Share this post


Link to post
Share on other sites