Help with Wordpress Site Customization 'Featured Img Size' & 'Non-Featured'

0
votes

I'm finalizing a customization on a small Wordpress 'Magazine' type website. I've come across a couple problems that I need some help on as I'm pretty novice to PHP.

I have a 'above-the-fold, main featured area, containing 3 images' with small excerpts of post titles. Under the fold, I have the 'non-featured' with images displayed under the 'post titles'

The 'Featured-images' I need displayed around 270 width, 250 height. With the non-featured, around, 260 width with 230 height. The sites structure within the 'featured' concerned area contains, 

<div class="post">
   <div class="p-feat-post">
       <div class="p-feat-post-img">

I've tried altering the height of the images on 'featured' area within all of these classes, but non worked correctly, and in some cases, seemed to stretch the img but still didn't display any height adjustment (almost as it was blocked, by the 'post title-area-box' underneath it (Then why would "a img" work?)

The only alteration that worked was defining a height within the genera' 'a img' tag;

a img {

}

But that also changed the height of the non-featured. I've tried 

.p-feat-post-img, a img {

}

Can anyone assist me with the code on specifying for just the 'featured area' image? Thanks for any help!

2
phpcsswordpress

2 Answers

0
votes

For Non Featured Image:

    a img {
       width: 150px; //You can modify accordingly
       height: 150px; //You can modify accordingly 
    }

And for Featured Image

    .p-feat-post-img, a img {
       width: 350px; //You can modify accordingly
       height: 350px; //You can modify accordingly 

    }
0
votes

Make sure your image has been changed to fit the desired height and width of the divs. This seems pretty simple though:

.p-feat-post-img { background:url(/filepath_to_image/name_of_image.png) no-repeat; width:270px; height:250px;}