• Resolved John

    (@johncpatterson)


    Hello all,

    I have a WordPress website theme that is set up to apply a slight “shadow” to the bottom of my images on the website, in order to make them look nicer for viewers. However, the website is set up in a way that only the pictures on the “blog” template pages have the shadow, but the pictures on the “default” template pages do not, and I want to get them to apply to the “default” template pages as well since those are mostly what I am using. The CSS code for the image shadow is as follows (the image shadow is referred to as “image_shadow_verylarge.png” below):

    /* Blog */
    #content #blog { width: 600px; float:left; }
    #content #blog .post { width: 600px;}
    #content .post { float: left; margin-bottom: 30px; border-bottom: 1px dashed #e1e1e1;}
    #content .post .posttitle h3 a{ font-size: 1.5em; line-height:1em; margin-bottom:5px;}
    .post .postimage { display:block;  width: 600px; height: 230px; padding-bottom: 24px; float: left; background:url(../images/image_shadow_verylarge.png) bottom center no-repeat;}
    .post .postmeta { border-bottom: 1px dashed #e1e1e1; padding: 3px 0px;  margin-bottom: 20px; float: left; width: 100%; font-size: 0.85em;}
    .post .postmeta span { float: right;}

    You can also see an example of the image shadow here: http://www.turkhitbox.com/themes/?theme=verse/ (then click “blog” at the top)

    And here is an example of an image that does not have the shadow, but I wish it did, at my website: http://www.lifebyjohn.com/coaching/what-is-life-coaching/

    Would anyone be able to tell me how to apply the above code, most notably the sentence where it says “.post .postimage”, to my normal code and not just the blog pages, so that I get the image shadow on all of my images?

    Thank you so much!

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Applying a background image to an existing image on WordPress theme via CSS’ is closed to new replies.