Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jun 2012
    Location
    Australia
    Posts
    17
    Thanks
    3
    Thanked 0 Times in 0 Posts

    How to Put Different Size Images in Footer

    I want to put three images in the footer of my blog. The first, a map of Australia, is already there. The second is a smaller image that will go between the h4 tags in the contact details area, and the third will be a similar size image to the map that will go in the left side of the footer.

    This is the existing code that controls the images.

    Code:
    .footer-wrapper .footer_widget img {
    height:220px;
        width:250px;
    The problem is it controls every image in the footer, so they're all going to be the specified size, even the much smaller image between the h4 tags. How do I modify the code so that the other two images can be altered separately from the first?

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,864
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    How about using the following selector instead?
    Code:
    .footer .last img{
    
    }
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Jun 2012
    Location
    Australia
    Posts
    17
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks for your reply.

    I sorted the issue out for the most with the following code:

    Code:
    .footer-wrapper .second_footer_widget img {
    height:29px;
    width:150px;
    padding:0px;
    margin:0px;
    The image has pushed the contact details area down. The only way I've been able to correct this is to shrink the height of the image. But this makes it too small. I've tried reducing the padding and the margin, but this has had no effect. Is there a way to reduce the space directly above and below the image so I can make the image a little larger?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •