MyBB Community Forums

Full Version: Creating the shadow (like on this forum)
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
As per the title.

How do we create the shadow, around the body, as on this forum?

I am using the default theme with my own.

Thanks all

Phil


vwcamper.net/forum
This site uses semi-transparent .png files for making shadows, however you can achieve this applying CSS Box shadows in container

#container {
    box-shadow: 6px 6px 10px #000,  -6px 6px 10px #000;
}
Your going to need to do some editing with global.css but basically.

Go to your ACP>>Templates & Styles>>Click on your main theme>>Global.css>>

Find #container in simple mode and add:

-webkit-box-shadow: 0px 0px 24px 0px rgba(50, 50, 50, 1);
-moz-box-shadow:    0px 0px 24px 0px rgba(50, 50, 50, 1);
box-shadow:         0px 0px 24px 0px rgba(50, 50, 50, 1);

Should all work correctly.

Smile
Thanks all, as always.

What's the difference between the two codes given?

One is a lot longer than the other!
The second one has the vendor-specific prefixes. I know the -moz- one is no longer needed for Firefox (at least for the drop shadow) but it may be a good idea to leave the -webkit- one in, to support any browser not using the current webkit version (Older iOS and Android versions, for example).