Header Logo padding/spacing
Permalink Browser Info Environment
How would I get rid of the extra spacing below the logo?
See attached.
Thanks.
See attached.
Thanks.
Type: | Discussion |
---|---|
Status: | New |
Hello,
I have the same issue with too much room below my logo. See attached picture.
If I adjust this with your instructions, will the new padding properties stick through a future Slate or C5 update? or do I need to go through these steps:http://www.concrete5.org/documentation/how-tos/designers/modify-a-p...
This will be my first ever attempt at adjusting code on the server & wanted to be sure to avoid future upgrade troubles.
Thank you much!
I have the same issue with too much room below my logo. See attached picture.
If I adjust this with your instructions, will the new padding properties stick through a future Slate or C5 update? or do I need to go through these steps:http://www.concrete5.org/documentation/how-tos/designers/modify-a-p...
This will be my first ever attempt at adjusting code on the server & wanted to be sure to avoid future upgrade troubles.
Thank you much!
If you add those CSS changes to the Custom CSS box in the theme's Customization Panel (Go to Dashboard->Pages & Themes and click Customize next to Slate), they will stay in place when updating to future versions. Otherwise, if you just edit the main.css file it will get overridden when updating.
You would need to add this to the Custom CSS box and just adjust the padding accordingly:
Also, you might want to make sure your logo image doesn't have actual extra space at the bottom under the logo. As well as make sure in the block in the Site Name stack, there's no extra returns/breaks/paragraphs after the image.
You would need to add this to the Custom CSS box and just adjust the padding accordingly:
header { padding: 40px 3.8%; }
Also, you might want to make sure your logo image doesn't have actual extra space at the bottom under the logo. As well as make sure in the block in the Site Name stack, there's no extra returns/breaks/paragraphs after the image.
Got it! I noticed I did have a little extra space in the site name stack after the logo and I also cropped my logo a little tighter. Along with adjusting the custom css to:
header { padding: 40px 3.8% 25px; }
Thank you for all the tips! You really helped me out!
Erik
header { padding: 40px 3.8% 25px; }
Thank you for all the tips! You really helped me out!
Erik
You're welcome!
Hi, when you add custom css to the theme, do you separate each line of code by a comma or by adding it to a new line? Sorry, new at this! Thank you! MR
So for each element your adding styles for, the individual properties for that element are separated by a semicolon (;). But nothing needs to separate each new element - it should just me on it's own line. So for example if you had two elements you were creating styles for:
#element1 { color:#000; width:100px; } #element2 { color:#666; width:200px; }
So I want the header to have no padding but the content areas below the header sections to have the 40px 3.8%; padding. I've tried to accomplish this by changing padding in the main.css and in the minimal.css to no avail. It seems whatever the container is supersedes all.
Thanks.
Thanks.
So are you using the minimal skin? If so, in the minimal.css file change the padding on #wrapper
You might also what to add the padding to #feature
That means the top and bottom padding are 40px and left and right are 3.8%. So adjust the 40px to whatever you want it to be. If you just want to change the bottom padding, change it to this: 40px 3.8% 20px
Where 20px is the new bottom padding property