how to reduce space between sections in shopify

hello everyone,welcome back to the channel today we,will talk about a common problem that,most of people have in designing their,shopify store,how to add spacing on the web page for,example here say i don't like the,navigation menu being too close to each,other and i would like to add more,spacing in the middle how can i do that,right click on the page and select,inspect and then click the arrow button,to find the navigation bar on the page,in the html structure you can see there,are four ally,elements under the ul element which,represents the navigation menu,here we try to change the css right on,the page to see what will happen,basically we find the css rules for the,ally,element under the navigation bar and set,the margin right to 30 pixels,since the css rule applies to all the,ally elements under the navigation bar,it will increase the spacing altogether,we don't need to change them one by one,now we can see the spacing becomes,larger which is what we,want keep that in mind the changes we,make on the web page are temporary,in order to make permanent change we,will need to update the actual code in,shopify,let's go back to the shopify code editor,first we need to copy the css class name,of the navigation bar and find it in the,css code,then let's find the ally element under,the navigation class name,and set margin right to 30 pixels,save the change and go back to the store,home page and refresh it,but here we go we have a nice looking,navigation bar with better spacing,let's do another example we would like,to make the title and the subtitle in,the middle to have larger separation,now we do it in the same way use the,arrow to find the subtitle element,let's set the margin top to 30 pixel to,see what will happen on the page,as expected the vertical spacing,increases,let's copy the class name of the,subtitle element and find it in the code,editor,here we need to delete the other class,names we copied and only search the,first one,now set the margin top to 30 pixels,save the changes and refresh the store,home page,nothing happens to the home page the,spacing is still,same as before we can try to find out,why from the css inspector,if we scroll down we can see our rule,got overwritten,so we need to something special to fix,it let's go back to the code editor,let's add important to our rule to make,it always apply,we made it happen there are more space,between the title and subtitle now,wish you enjoyed today's video if you,like it please click the like button,and subscribe to the channel see you,next time

Congratulation! You bave finally finished reading how to reduce space between sections in shopify and believe you bave enougb understending how to reduce space between sections in shopify

Come on and read the rest of the article!