Custom CSS

This topic has 4 replies, 2 voices, and was last updated 9 years, 5 months ago by Sakin.

Viewing 5 posts - 1 through 5 (of 5 total)

Author

Posts
May 28, 2015 at 5:14 pm #58501

andliowoo
Participant

Hi There,

I’m running the following site using Catch Box Pro:
welcome.dls-jersey.co.uk

I’ve got some custom CSS that make the page background transparent and display a graduated site background.

I’m trying to make the footer appear blue as the menu bar does, but can’t identify the colour range.

I’d also like to make my header logo/image the same width as the menu bar – I guess that means removing any padding???

Thanks in advance
Andrew

May 29, 2015 at 10:18 am #58538
Sakin
Keymaster
@andliowoo:
1. I check in your site and your footer and menu bar has same background color. You just need to change the text color, for that you can add the following css in your Custom CSS box:
```
#colophon { border: none; }
#site-generator, #site-generator a {
    color: #eee;
}
```
2. For this, just go to “Appearance => Theme Options => Header Options” and then make 0 in Header Right Margin and Header Left Margin
May 29, 2015 at 3:40 pm #58551

andliowoo
Participant

Brilliant, Thank you!

June 8, 2015 at 3:07 am #59109

andliowoo
Participant

Hi there, I’ve got a gradient background in custom css:
( welcome.dls-jersey.co.uk )

body {
background: #1e73be; /* Show a solid blue color for older browsers */
background: -moz-linear-gradient(#1e73be, #ffffff);
background: -o-linear-gradient(#1e73be, #ffffff);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1e73be), to(#ffffff)); /* older webkit syntax */
background: -webkit-linear-gradient(#1e73be, #ffffff);

How can I make sure that the size of the background to “covers” the whole page as I sometimes get a blue bar at the bottom of a large browser window?

Thanks

June 9, 2015 at 8:21 am #59174
Sakin
Keymaster
@andliowoo: It’s because #ffffff is white and you will see white at the end. So, change that to blue like below:
```
body {
    background: #1e73be; /* Show a solid blue color for older browsers */
    background: -moz-linear-gradient(#1e73be, #b2dafd);
    background: -o-linear-gradient(#1e73be, #b2dafd);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1e73be), to(#b2dafd)); /* older webkit syntax */
    background: -webkit-linear-gradient(#1e73be, #b2dafd);
}
```
Author

Posts