Image in div.box overflows in a way that always crops the top, how to fix?

Discussion in 'HTML & Website Design' started by Oscar9er, May 23, 2015.

  1. #1
    Hi if you go to the following page you will see that the first pic to the left the man's head is cropped off. This is due to the way the image flows inside the div box, It overflows so that the tops and sides hide. I would rather it stay to the top and centered but also be responsive (which it is now). If it is going to cover part of the image I rather it be the bottom

    Please see: http://churchgigs.com/listing-category/counselors/

    I will post a couple pics of what I mean and what I think is the problem.
    5.jpg

    I think it is this overflow-y property (see circles) how do I edit this in wordpress, in the stles.min.css file?



    here is a link to the theme files css folder
    http://churchgigs.com/wp-content/themes/Church%20Gigs%20Ministry%20Gigs/css/

    Thx
    -C
     
    Oscar9er, May 23, 2015 IP
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #2
    It's being applied as a background-image, so on modern browsers you'd have to use background-size to scale it to "cover" -- but really that's why massive background images like that have ZERO business on a website if you care about speed, accessibility or usability -- there's a REASON you do NOT see a lot of "real" websites pulling those types of stupid stunts.

    Of course, see my response in your other thread for your REAL problem here -- buggy broken tools, bloated train wrecks of how NOT to build a website, and a general "throw that mess in the trash and start over as there's NOTHING worth even TRYING to salvage from it!"
     
    deathshadow, May 24, 2015 IP