[Support request] Sidebar widget box shadow effect and radius

Home Forums Support Sidebar widget box shadow effect and radius

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #434814
    Leon

    Hello Tom,

    I was wondering if there is a way to make all sidebar widgets and main content areas box shadow effect using css. Plus, ID like to add 6px radius to all of them.

    Thank you
    Leon

    #435076
    Lyle

    Hi Leon,

    Tom or Leo may have a more elegant method, but give this a go (adjust values as desired):

    .sidebar .widget {
        padding: 15px;
        border: 2px solid grey;
        border-radius: 6px;
        box-shadow: 5px 5px 5px grey;
    }
    
    .one-container .sidebar .widget {
    	padding: 10px;
    }
    
    .one-container.both-right .site-main, .one-container.right-sidebar .site-main {
        padding: 15px;
        border: 2px solid grey;
        border-radius: 6px;
        box-shadow: 5px 5px 5px grey;
    }
    
    .one-container .site-main {
    	padding: 15px;
        border: 2px solid grey;
        border-radius: 6px;
        box-shadow: 5px 5px 5px grey;
    }

    Cheers!
    Lyle

    http://snifflevalve.com
    Tutorials and tips for GeneratePress, WP Show Posts, WordPress and Elementor

    #435256
    Leon

    Thank you Lyle.

    I’m using separate containers so I’ve achieved what I wanted using below code:

    .separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation, {
        box-shadow: 2px 2px 15px grey;
        border-radius: 6px;
    }

    Thanks again
    Leon

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.