Adding shadow to wp-codebox

Too bad wp-codebox contains two divs namely wp_codebox_msgheader and wp_codebox, we cannot simply give the box-shadow to one single div. After playing with this a bit, here is my parameters. The css file is located at /your-wp-root/wp-content/plugins/wp-codebox/css/codebox.css.

.wp_codebox_msgheader {
        box-shadow: 6px 14px 11px #808083;
}
.wp_codebox {
        box-shadow: 7px 10px 10px #888;
}

The overlapped area seems smooth with this setting.

I also added bottom margin to the codebox, see if you like it.

.wp_codebox {
        margin-bottom: 20px;
}

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s