Very nice Website, Lauren! I have the same question as you for my company site, http://www.havebluepower.com
Hi Lauren! Looks tasty there on the website! (Tip: run the regenerate thumbnails plugin once to fix older thumbnail sizes)
For the caption background:
.entry .wp-caption { background: #mycolor; }
The sidebar:
@media only screen and (min-width: 480px) and (max-width: 1200px) {
.s2-expand .s2 { background: #f0f0f0; }
}
@media only screen and (min-width: 480px) and (max-width: 960px) {
.s1-expand .s1 { background: #f0f0f0; }
}
@media only screen and (max-width: 479px) {
.sidebar { background: #f0f0f0; }
}
Then you’d also need to edit /img/sidebar/s-left.png and /img/sidebar/s-right-s2.png and save them with your color. Or all images in the sidebar image folder if you want it to work with all layout options.
There is quite a bit of “css-logic” going on behind the responsive and toggle-able sidebars (gave me a headache to create), so that’s why there are so many different things to change.
Anonymous User 12851872
(@anonymized-12851872)
hi,
Just a clarification, this is not the same lines as in the child theme,
we need to change the child theme or add these lines in addition?
/* Global */
.mystyle {}
/* Tablet - 800px, 768px & 720px */
@media only screen and (min-width: 720px) and (max-width: 800px) {
.mystyle {
}
/* Mobile - 480px & 320px */
@media only screen and (max-width: 719px) {
.mystyle {}
}
/* Mobile - 320px */
@media only screen and (max-width: 479px) {
.mystyle {
}
thank you
Anonymous User 12851872
(@anonymized-12851872)
I had to off
.col-3cm .main-inner {background:none;}
.col-3cm .main {background:none;}
otherwise remain gray sidebars
even before they try to
/* Tablet - 800px, 768px & 720px */
@media only screen and (min-width: 720px) and (max-width: 800px) {
.s2-expand .s2 { background:none; background-color: #FFF; }
}
/* Mobile - 480px & 320px */
@media only screen and (max-width: 719px) {
.s1-expand .s1 { background:none; background-color: #FFF; }
}
/* Mobile - 320px */
@media only screen and (max-width: 479px) {
.sidebar { background:none; background-color: #FFF; }
}
