When I add an ordered list or unordered list on the website, the bullet points and numbers do not follow the padding applied. I disabled all plugins and then activated the plugins one by one. This issue occurs when the WooCommerce Views Plugin is activated.
I am trying to: Display text in list format - Ordered list and unordered list
Link to a page where the issue can be seen: hidden link
I expected to see: Please see attached screenshot expectedlist.png
Instead, I got: Please check attached screenshot notexpectedlist.png and the link above.
Hi,
Usually this happens when the CSS applied in Layouts CSS and JS conflicts with the original styles somehow. We can try to override that by adding the following code to Layouts CSS:
.product-left-row-one li {
margin-left: 22px;
}
Hi Christian,
The css code worked perfect for the content inside the body, but for content inside fields created by types, the bullet points are still looking same as before.
Please check this link and the attached screenshot: hidden link
Okay great. If another section needs to be included, you need to modify the CSS code to target that section. Please see the attached screenshot. This section is a div with class "product-policies" instead of "product-left-row-one". So you must add that selector to the CSS:
.product-left-row-one li, .product-policies li {
margin-left: 22px;
}
Hi Christian,
On mobile devices, there is no margin. Please see the screenshot. If possible, can you please help me with the css code to add margin for mobile devices as well.
It appears that the code I provided has been placed in a media query limiting its effectiveness to displays greater than 850px wide. Please see the attached screenshot. Can you tell me why this media query was added? Can it be removed?
Hi Christian,
I had placed the code inside the media query by mistake. I have placed it in the correct place now and it works fine! Thanks a lot for the help.