How to remove spacing between graphic and text in the Feature List for small mobile screens

Support
#1

Hello,

I’m using the Feature List with a graphic. However for small mobile screens (320px) the text I have on the left side is getting cutoff. I see the element has a style of margin-right 20px when I view the Chrome’s Developer Tools but I can’t find the right CSS rule that targets the element so I can manipulate the margins.

I’ve tried div.feature-box-graphic-outer.circle and div .feature-box-graphic-outer.circle and div.feature-box-graphic-outer .circle but nothing works.

I add a picture of what I’m seeing if that helps. Thanks!

#2

Hi there,

Thanks for writing in.

You can use the selector in your screenshot, example

.x-feature-box-graphic-outer, .x-feature-box-graphic-inner {
margin-right: 0px !important;
}

I added !important because the existing 20px margin is added as style attribute which makes it more prioritized than CSS added through classes.

Thanks!

1 Like
#3

I forgot about !important. Dang it! I’ll try that. Thanks!

Update: This worked! Thanks again for your help.

#4

You’re more than welcome, glad we could help.

Cheers!