Could you please advise how to remove the default margin and padding from a ul element? Because of them, the bullet points extend beyond the edges of the screen.
This topic has 11 replies, 5 voices, and was last updated 1 month, 1 week ago ago by Tony Rodriguez
Could you please advise how to remove the default margin and padding from a ul element? Because of them, the bullet points extend beyond the edges of the screen.
Hello, st7878,
Unfortunately, it cannot be removed; however, it can be modified, for example, by using the following code:
ul {
margin: 0;
padding: 0;
}
Best regards,
The 8Theme Team
You have misunderstood. I need to remove the margin: 0 and padding: 0 from your styles. Currently, the list bullets are overflowing off the edges of the screen; I need them to display properly.
Hello @st7878,
We apologize for the misunderstanding regarding your request. Could you please try one of the following custom CSS snippets:
.elementor-location-single ol, .elementor-location-single ul {
list-style-position: inside;
}
or
.elementor-location-single ol, .elementor-location-single ul {
padding-inline-start: 20px;
}
Please add one of these suggested snippets in your Theme Options -> Theme Custom CSS -> Global CSS.
Custom CSS documentation: https://www.8theme.com/documentation/xstore/additional-customisation/optimal-placement-for-custom-css-code/
Best regards,
Jack Richardson
The 8Theme’s Team
Both options do not solve the problem. (((
Hello @st7878,
Please provide the URL of the page you would like us to review, as the custom solution we provided should function correctly. You may also share temporary wp-admin access in the private content section so that we can implement it directly on your website.
Examples:
https://gyazo.com/497d51fb5153b34f2d959941f5d27e23
https://gyazo.com/2143e82dafeab62f2198a6edaf6fbe78
You need also to remove the custom CSS you previously added -> https://gyazo.com/c7d8f93c46ae032aef540cd52f5a7ba3
Best regards,
Jack Richardson
The 8Theme’s Team
I removed my style and added yours. Yes, it works on the post/page: https://voyah.com.ua/who-will-the-voyah-electric-cars-suit-for-me/ but it doesn’t work on the site’s pages: https://voyah.com.ua/voyah-free/ (scroll to the very bottom of the page to the SEO text).
Hi,
Could you please provide a few additional screenshots so that we can better understand exactly which content you are referring to?
Best regards,
8Theme’s Team
Hello @st7878,
If you need to apply this modification globally across your pages, you can use the following snippet in your Theme Options -> Theme Custom CSS:
[data-elementor-type=wp-page] ol,
[data-elementor-type=wp-page] ul {
list-style-position: inside;
}
or
[data-elementor-type=wp-page] ol, [data-elementor-type=wp-page] ul {
padding-inline-start: 20px;
}
However, we recommend using custom widget-based CSS only in the specific areas where such improvements are required. For example, in your text widget, you can add the following custom CSS under “Advanced (tab) → Custom CSS”:
selector ol, selector ul {
list-style-position: inside;
}
or
selector ol, selector ul {
padding-inline-start: 20px;
}
Best regards,
Jack Richardson
The 8Theme’s Team
Thanks for the support! My topic “How can I disable the default margin and padding for the `ul` tag?” has been successfully resolved.
Dear st7878,
It’s great having you in our WordPress & WooCommerce community!
Every insight you share helps us refine XStore and build tools that empower thousands of online store owners worldwide.
Leave Feedback →
(takes less than a minute)
Together, we grow stronger with every release.
Topic closed.
The 8Theme Team
The issue related to '‘How can I disable the default margin and padding for the `ul` tag?’' has been successfully resolved, and the topic is now closed for further responses