Oddball formatting with bullet points

RapidWeaver Classic General
1

On my web pages, I use quite a few bullet points. I get oddball formatting like the extra space between the lead to the bullets and the bullets on one list, but not on the next. I have included a screen shot of an example. If you wish to see how it is doing on other pages, you can go to my site at foskeyroad.com

I am using the Foundation Theme and the paragraph stack for my text.

Thanks, in advance, for any help anyone may be able to offer.

-ed-

web-bullet-points.jpg1064×994 666 KB

2

Put each list in its own paragraph stack

1 Like
3

Scott,

I tried that with no change. The bullet list always does the same thing. I hope Joe comes across this, but I will be putting this on his support list.

Thanks for your input.

-ed-

4

Lists have a bottom margin applied to them, just like most elements, to provide the correct spacing for both typography and other elements that use them (like menus).

You can selectively remove the bottom margin from lists that you have inserted via styled text into Foundation Paragraph stacks with the following code in your page or site-wide CSS:

.com_joeworkman_stacks_foundation_paragraph_s3_stack ul{
    margin-bottom: 0!important;
}
1 Like
5

In terms of adding them separately in a Paragraph stack as @swilliam suggested, this does work but you would need to put only the list in a paragraph stack on its own (i.e. without any other text) and then check the Remove bottom margin in the paragraph stack settings. This will remove the bottom margin from the paragraph, just leaving the bottom margin on the list preventing the double bottom margin situation that you have at the moment.

This double margin is not a bug but is a result of the ability to add styled text inside a paragraph. Lists <ul> are not actually allowed inside a paragraph tag by HTML and so the browser will break the paragraph apart into separate <p> tags around a <ul> tag resulting in multiple bottom margins.

3 Likes
6

Andrew,

Thanks for the help and clarification. HTML is very far out of my league. I am a novice who, unfortunately, has to stick with basics most of the time.

I did get it working.