CMS Development

ZWS_Marketing
Teilnehmer/-in

Need to change bullets and radio button alignment on forms

lösung

I inherited a terrible way to show a bulleted list: orange triangles that are not indented with oxygen font that is barely readable. I want to change these to orange circles with Trebuchet MS that are indented but I cannot locate the triangles in the code (I've searched for 2023 and 8227). Also, when I list radio choices on my blog subscription form, the default is to stack the radio buttons vertically; how do I align the radio buttons horizontally. Can anyone help me? Look at how bad this is: http://www.zerowait-state.com/news-blogs-events-press-releases 

0 Upvotes
1 Akzeptierte Lösung
DaniellePeters
Lösung
Stratege/Strategin

Need to change bullets and radio button alignment on forms

lösung

You need to remove

 

"list-style: outside none none;" from .body-container-wrapper ul

 

and 

 

"list-style-type: none !important;" from .body-container-wrapper ul li

 

Those styles are in ZeroWait-State-Nov2015-style.css

Lösung in ursprünglichem Beitrag anzeigen

3 Antworten
DaniellePeters
Stratege/Strategin

Need to change bullets and radio button alignment on forms

lösung

The bullets are coming from the CSS styles on the following selectors:

.body-container-wrapper ul, .body-container-wrapper ul li, .body-container-wrapper ul li::before

In combination with each other, the default bullets are being altered, and the triangles are being adding by adjusting the border of the ":before" pseudo-element.

 

For the radio buttons, you can add "display: inline-block;" to the <li>s with the class ".hs-form-radio"

 

 

ZWS_Marketing
Teilnehmer/-in

Need to change bullets and radio button alignment on forms

lösung

Thankfully, all of my orange triangle bullets are gone! But, unless I add the bullets manually, nothing shows up. 😞  How & where do I input code to use circles now that my triangles are gone?

0 Upvotes
DaniellePeters
Lösung
Stratege/Strategin

Need to change bullets and radio button alignment on forms

lösung

You need to remove

 

"list-style: outside none none;" from .body-container-wrapper ul

 

and 

 

"list-style-type: none !important;" from .body-container-wrapper ul li

 

Those styles are in ZeroWait-State-Nov2015-style.css