Home Forums Weaver Xtreme Theme Override post shadow on single page display?

Topic Resolution: Answered

This topic contains 2 replies, has 2 voices, and was last updated by  tix 2 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #56336



    To display posts with a shadow on a page with posts I’ve added a class (flex3) in the “Add Classes to this post” .

    CSS: .flex3{height:300px;background-color:transparent; margin 10px auto; padding:5%; -webkit-box-shadow: 5px 8px 10px 5px #E3E3E3;box-shadow: 5px 8px 10px 5px #E3E3E3;}

    That works OK.

    To override the shadow display on the single page view I’ve added another class (flex3 noshadow) in the “Per Post body Class – CSS class name to add to HTML <body> block when this post is displayed on Single Page.”

    CSS: .flex3.noshadow {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}

    That doesn’t seem to work. I’ve tried with adding !important to it, no result 🙂

    Thank you.


    Best Answer


    This reply has been accepted as the best answer.

    As the comment mentions, the class is added on the HTML body tag.

    Therefore the proper selector is .noshadow .flex3 , the body class comes first and there need to be a space between the two

    .noshadow .flex3 {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}

    If still an issue, we need a link to your site pages (single post page and page with posts) to be sure of the proper selector.

    Note. You should not use a fixed height for a post as it will be non responsive. When the browser gets smaller the text may reflow and get cut. Instead use a min-height.




    Of course, got a bit out of touch there 🙂  Works perfect when putting “noshadow” in per post body class. The fixed height I only used to display them with the same height on page with posts. Needs to look like a calendar. But min-height is of course a better solution.

    Thank you scrambler . Have a nice weekend.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.