Bulleted list - Word wrapping

Again regarding the bulleted list. Im using 4 icons under each other, but the text doesn’t wrap when reaching the end of the column (see screenshot 2nd bullet), instead it begins at the start of the line and overrides the text there. Very strange. How can this be resolved?

Would be great if somebody could help me to fix this bug asap. Was planning to go life with this site today… If the browser window is decreased in size, all the bullets dont wrap properly…

In case you want to test it, it’s www.omyoga.co.

Hi Fabian,

Using Firebug in Firefox, I see that you have a line height of zero for that area.

Try this CSS:

.fl-module-icon .fl-module-content {
line-height: 1.6em;
}

Adjust the 1.6 value as required :slight_smile:

Cheers!
Lyle

Hi Lyle, thanks for your response!

Actually I changed it to 0 as Ben suggested here because I wanted the bullets to be closer together. I feel it doesnt look nice with such a big gap in between. Is there no way to keep the gap in between the bullet points closer, but still enable wrapping when the line is full? Its kind of strange…

Ok, changed it to 1.0em. I think this looks ok…

Hey Fabian,

I just checked the page and it seems the height style we added isn’t specific enough. You should still be able to make those texts closer through this style, just remove the previous one.

.fl-module-icon .fl-module-content .fl-icon-wrap .fl-icon-text {
  height: auto;
}

Ben