Skip to main content

Forums

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

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

    Hi
    I would like to have a fixed header width relative to the width of an image
    https://jsfiddle.net/0nvjbbz8/

    The problem is that the header is fixed, so I can’t use relationship with parent/child.
    My image is in 2/3 so 66.666%. I tried to calculate the header with some math like calc(100% – 33.333%) but it doesn’t work !

    I just want to keep the image height relative to the screen, and the header fixed.

    Every help would be appreciated !
    Thx

    #256195
    Chris Coyier
    Keymaster

    I dunno maybe some kinda sticky header?

    https://codepen.io/chriscoyier/pen/wepeGw

    #256198
    culbrique
    Participant

    Thanks Chris

    But sticky doesn’t change the width value of the header, and that’s the deal.
    I’m looking for a trick to apply to the header something that say : do the same width as the image.

    I could do it with Javascript but window.resize do a time latency.
    The only thing I know is that my image is 2/3, keeping fixed header and image 100vh.

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