Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other Background image aspect ratio with fixed height

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #31869
    BarsikSoftPaws
    Participant

    Hi guys!

    I’m trying to do one project and I’m stuck basically right in the beginning. I have made nice header that shall be covering 100% width of the browser window, but it’s height has to be fixed size (height: 400px;). Actually it has to be same as at this website: http://www.weightshift.com/ just positioned on the very top. I’m open to any kind of script. JavaScript, PHP, CSS, combination of all. All I find in Internet are the full screen background plugins like Jquerry or CSS3. What about when height is fixed?
    I need heeeeeeeeelp! Please please please, anyone? :)

    #56815
    aaronsilber
    Participant

    @BarsikSoftPaws – I’m a little confused as to what you are trying to accomplish. If you are trying to create a header that spans the width of the browser window, but has a fixed height of 400px, I can help you very quickly. This is basic CSS, and an example of the markup required follows;



    /*Rest of page follows */

    I won’t be styling the unordered list, but this is how you would style the header id element;



    #header {
    width: 100%;
    height: 400px;
    }

    Like I said, very simple CSS. Honestly, I felt bad for you because you didn’t have any comments – and this seemed like such a simple question. If this isn’t what you were looking for, I can continue to help.

    #56452
    BarsikSoftPaws
    Participant

    I was trying to make image to set as a header. Simple pic, that would be 400px height and with width:100%. I was trying to figure out if there is any way that the picture with fixed height property still could maintain aspect ratio depending on a browser screen? That’s my question :)

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Other’ is closed to new topics and replies.