1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

how to move website lower, but keep logoBlock height ?

Discussion in 'Styling and Customization Questions' started by erich37, Apr 24, 2013.

  1. erich37

    erich37 Well-Known Member


    I have been trying to move the whole website lower by about 50px , but not sure how to do this.
    The only thing I have achieved is to move the Navigation-bar lower. But I can not get the body and the content of the website to move lower.

    How to put a padding or a margin or some other CSS magic, so that there is a space of 50px between the "#logoBlock" and the other items of the website ?

    I have put a shadow towards the "#logoBlock" which should remain its height as is (logo-height).
    background: #FFFFFF;
    box-shadow: 1px 0 4px rgba(0, 0, 0, 0.4);

    Appreciate your help!

    Many thanks! :)
  2. Lycaon

    Lycaon Well-Known Member

    Would adding this work?

    margin-bottom: 50px;
  3. erich37

    erich37 Well-Known Member

    yeah, but where to put it ?

    Adding it to the CSS of "#logoBlock" is just moving the Navbar down, but not the other stuff of the website. By doing so, the Navbar is overlapping the breadcrumb and the Forum...
  4. thumped

    thumped Well-Known Member

    i did this by changing the height setting for the logo image... very hackish, but works.

    I'd definitely prefer a more elegant solution.
  5. erich37

    erich37 Well-Known Member

    probably define a new "class" containing the "padding" and entering it into some template would work?
  6. Steve F

    Steve F Well-Known Member

    Header height is tied into the logo height by calculations, just increase the logo height then adjust logo if need be.
  7. erich37

    erich37 Well-Known Member

    quite hard to achieve this...... especially when you have a logo which requires a white-colored background.
    The trouble is that the NavTabs are tied to the header....... :(

Share This Page