Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hei.
1) I wonder which CSS could help me to align text behind bullet points
in a bulleted list, so that all text starts aligned even if the text goes over
several lines (see: on mobil devices)
2) How to set a start point for my text (always) behind my bullet points
even if the bullet points technically are parts of the text (I guess).
I’m looking forward to read your answer :)
OK :) I found out that the bulleted list function work!
Therefore are my questions:
1) How to change the style of the bullet into this –> •
instead of a tiny cube?
2) How is it possible to let the bulleted list starts form
where the text usually would start? (without a gap)
see: minmassasje.com/massasje
3) How to use icons instead of the bullet points without
missing the bulleted list alignment?
(the alignment of the text behind the bullet points/icons
regardless how many lines it will scale down to on small screens)
see: minmassasje.com/service
4) How to start a new line within the same bullet point?
Hi Sebastian
1. Try the following under Appearance > Custom CSS:
/* Lists */ .entry-content ul { list-style: disc; }2. Sorry, not quite with you there. There is no top margin added to lists so not sure why they would be starting lower. Which list are you referring to?
3. Try our List (PB) widget. It has a few options you can choose from. If you can’t access that widget, ensure Settings > SiteOrigin Page Builder > Bundled Widgets is activated.
4. Hold down shift while clicking enter for the new line.
1) This CSS work. But how to make the „disc“ even more BOLD?
2) Sorry my fault :) I meant the space between the left side of the text box
and the start point of the list.
How is it possible to let the list start form the left side without any space in-between?
(in page builder with visual editor)
3) I tried the List (PB) widget.
Fair enough do the icons start from the left side without a gap – nice.
But I’m totally longing for the visual editor functionality
(in specific the text type options & horizontal line)
This could probably be achieved through a good CSS code
in the widget styles attributes?
And I would love to use my own icons ..PLUSS there is „just“
A check icon in various colors available.
It would be just perfect to build a list with my own icons
(http://minmassasje.com/service) within visual editor
(that starts form the left side without any gap! as now.)
But with the following text behaving like a bullet list text
4) This is works fine now.
Thanks for your support and knowledge!
1 & 2. Try this instead:
/* Lists */ .entry-content ul { list-style: circle; margin-left: 0; }3. The functionality of the Visual Editor widget (are you using this widget?) is the best we can offer right now. Custom list images can be done with CSS. See:
http://css-tricks.com/almanac/properties/l/list-style/
or
http://www.w3schools.com/cssref/pr_list-style-image.asp
4. Super, glad that helps.
Thanks for your help Andrew!
1) & 2) er solved!
3) here I need to invest some more time to solve my challenge :P
Thanks for the info-sites!
Have a nice day.
Glad to hear some progress was made. All the best with your project.