Tutorial Stats
How To Put Box Shadow Effect On The Left And Right Side Of Your Weebly Site
Tutorial Description
This tutorial will show you how to put the box shadow effect on the left and right side of your Weebly site. The box shadow effect adds depth and dimension to a website.
SHOW MORE
Tutorial
Step 1. Open Weebly's HTML/CSS Editor
Click on "Design" at the top of the page, and then click on "Edit HTML/CSS" on the left side of the page.
Step 2. open the css file
Select "main-style.css" on the left.
Step 3. add css code
Scroll down and add the orange part to the following code:
#wrapper-content {
max-width: 1100px;
width: 100%;
min-height: 100%;
margin: 0 auto;
background: #ffffff;
overflow: hidden;
z-index:999;
box-shadow: 0px 0px 10px rgba(50, 50, 50, 0.17);
}
#wrapper-content {
max-width: 1100px;
width: 100%;
min-height: 100%;
margin: 0 auto;
background: #ffffff;
overflow: hidden;
z-index:999;
box-shadow: 0px 0px 10px rgba(50, 50, 50, 0.17);
}
You're done! Publish your site to see your site's new box shadow effect!
Need Help Installing This Tutorial?
Editor Tricks Web Design Services
Open
· Closes 5 PM
Closed
· Opens 7 AM
Recent Tutorial Comments
