Mini Content Background « Support Forum | Kriesi.at - Wordpress Themes and HTML Templates

Support Forum » Flashlight

Mini Content Background

11 posts from 4 voices

Started 1 year ago by nyct
Latest reply from Mya
This topic is resolved

Tags:

No tags yet.

nyct
Member

greetings and thanks for the fresh Flashlight theme really digging it and just getting into it and have picked up quite a few pointers from this forum already. i'm a bit of a novice with css/php but working my way through it.

a couple of questions on the Mini Content:

1. is there a way to change the background color of the Mini Content box and/or make it slightly transparent?
2. can i adjust the padding for ONLY the Mini Content box so basically my page contents sit much closer to the edge of the box?

thanks in advance.

Posted 1 year ago #
Dennis
Member

Hey nyct!

Custom-CSS:

1: Change Color

.box {background: none repeat scroll 0 0 #FF00FF;
}

Will for example change the color. But take a look at your main-menu! :-/

2: Padding...

.box {
padding: 30px;
position: relative;
z-index: 2;
}

Hope this helps!

Dennis

Posted 1 year ago #
nyct
Member

thanks for the reply Dennis.

so i see that this changes the background color / padding in all the content areas not just the mini-content box. hmm..
no way to just change those styles for only the mini-content layout? or am i missing something?

Posted 1 year ago #
Dennis
Member

Would not be easy and has to be "hardwired" - I think. Wait for a team-member! ;-)

Posted 1 year ago #
nyct
Member

gotcha.

Posted 1 year ago #
Ismael
Moderator

Hello,

Good thing you solved this on your own. :)

Dennis, thanks for helping out.

Regards,
Ismael

Posted 1 year ago #
nyct
Member

Hello Ismael. Actually this was not exactly solved. Dennis advised how to change the background on all contents which is helpful, but my initial question was how can I change the background and/or transparency of ONLY the Mini-Content Box, and not the main content area and sidebars. Could you please advise. Thanks again...

Posted 1 year ago #
Mya
Hi nyct,

To change the Mini-Content Box only, you'll want to use .mini_content_display . box as your declaration. Here's the specific code:
```
.entry-mini .box {
/* this will set the background opacity */
background-color: rgba(255,255,255,0.5);
/* this will adjust the padding */
padding: 30px;
}
```
Note: The above will set the box's background to 50% transparent. If you want say 75% transparency then you would opacity: 0.7.

Regards,
Mya
Posted 1 year ago #
nyct
Member

thank you!

Posted 1 year ago #
Mya

Hey!

You're welcome.

Regards,
Mya

Posted 1 year ago #
Mya
Hey nyct,

I noticed there was an error in the CSS I originally gave you. I edited my post above with the correct code but for the record use this instead:
```
.entry-mini .box {
/* this will set the background opacity */
background-color: rgba(255,255,255,0.5);
/* this will adjust the padding */
padding: 30px;
}
```
Regards,
Mya
Posted 1 year ago #