Header height (.bigheader and .smallheader)

New Front IT Support Forums Kanso Theme Support Header height (.bigheader and .smallheader)

  • Questo topic ha 4 risposte, 2 partecipanti ed è stato aggiornato l'ultima volta 7 anni fa da Tuktop.
Stai visualizzando 5 post - dal 1 a 5 (di 5 totali)
  • Autore
  • #3190

    Could you give me some pointers to how i can change the height of the header?
    I know it can quite easily be done with some CSS but when i started changing stuff, it started to look weird because i’m not CSS-hero :) (for example, the logo didn’t scale so it ended up overlapping below the menu)

    My client would, for example, like to see how the website looks with a header that is always 75px, or maybe 100px initially (instead of 150), then back to the normal 75px when scrolling starts. I hope i made myself clear.

    Once again, thanks in advance for your support!

    Amministratore del forum

    Hey there,

    please try this custom CSS:

    #header, .bigheader { height: 100px !important; }
    #logo img { max-height: 100px; }
    #header .smallheader { height: 75px !important; }

    the first two rows tell the initial header and the logo to be 100px in height, and the last row makes sure that the scroll header remains 75px; you can of course change the values to whichever ones fit you most ;) just make sure that the second line’s value is the same as the first line’s, otherwise the logo might stretch beyond the heading.

    Andrii / Satori Studio


    Ahhh, i was almost there :) but missed the logo img css.
    It’s perfect now.
    Thanks once again for helping me out!

    Amministratore del forum

    Glad to hear it worked!
    I’m thinking about introducing such a setting to the Theme Options panel, now that you’ve mentioned it :)

    A. / Satori Studio


    That would certainly be a great addition to the theme! It is already a really versatile, neat and tidy theme, but adding custom menu height properties would make it even better :) GJ!

Stai visualizzando 5 post - dal 1 a 5 (di 5 totali)
  • Devi essere connesso per rispondere a questo topic.