How can I locate a specific section's code ID for padding removal?

Store Design
1

Hello, I would like to use this code to remove padding on a section:

#shopify-section-1575924577429 .page-width {
	padding: 0;
}

But I need to replace “1575924577429” with the code ID from the section I want to use this on. How can I find the code ID from a specific section?

2

Hello,

You should put the css within the section itself and then you can use

#{{ section.id }} .page-width {
 padding: 0;
}

This is the best way to avoid problems if the section id changes for some reason.

It will also allow you to pass in a section setting to the padding option to allow different sections to have different attributes. e.g

#{{ section.id }} .page-width {
 padding: {{ section.settings.section_padding | default: 0 }}px;
}
1 Like
3

Thank you so much Jordan for your explanation, the thing is that I need to remove the padding on a specific section, the white part below the section that says “SETS”

#1.png
#1.png1915×965 258 KB

The theme has a fixed minimum height for the slidershow section of 150px and I need it to be minimum 110 of height. Is this posible to achieve by removing the padding?

4

Hello,

Ideally you should make the image the correct size rather than editing padding etc.

If you click on the slideshow section (where you circled in red) then there should be a little dropdown at the bottom of the settings called ‘custom css’. You can add css in that box to be applied only to that section without needing to know the section id

1 Like
5

Ok, thank you so much Jordan.