Unordered list in Foundation?

(Garth Poon) #1

How do you create an unordered list that keeps its font style when using Foundation?

I tried to do it with the Foundation Paragraph stack, the Paragraph Pro stack, and the regular HTML stack, but it seems as though the Font Vault styling gets removed from the unordered list no matter what I do.

e.g. (password is J3llyJ3lly)
You’ll see that the Font Vault styling gets applied to the first paragraph, and then it gets removed for the unordered list.

Any suggestions, @zeebe or @tav?

(Andrew Tavernor) #2

This is because although RW allows you to write HTML lists in styled text, if they are inside a paragraph tag the browser will break apart the paragraph and insert the list in between the two halves. This is because block level elements such as lists are not allowed within paragraph tags.

Therefore the reason your font vault is not getting applied is that the list is no longer within the paragraph that contains the font-vault class.

Luckily a simple solution is at hand. Using Paragraph Pro, simply change the tag setting to 'General Text Node` instead of the default paragraph. This will stop the browser breaking it apart and your font vault class will still be surrounding your list.

(Garth Poon) #3

Thanks @tav! That’s exactly what I was looking for! :slight_smile: