Support » Themes and Templates » Blix Top/Bottom Margin

  • Hi there 🙂

    I’ve done this with the Blix theme before, but can’t for the life of me remember how…I want the white “container” element to go all the way to the top and bottom of the page, but NOTHING I do is working. there’s already a “margin:0;” in the body CSS, and a “margin: 0 auto;” in the container tag. I’ve tried tweaking those in all of the obvious ways, and even tried specifying margin-top and margin-bottom instead and in addition to what’s already there. I also tried to add “height: 100%;” to the container element, but that didn’t do anything either.

    Anyone know what’s not working or possibly conflicting?

Viewing 4 replies - 1 through 4 (of 4 total)
  • esmi


    Forum Moderator

    Unless you provide a link to your site, no one will be able to offer much in the way of specific help.

    I’d rather not give out a link yet, but here’s a graphic showing what the issue is (note that each screenshot graphics have been outlined with dark grey):

    The code I’ve been working with is as follows:

    in css/layout.css (margins are already set to 0. I tried “margin-top: 0px;” as well, but no change)

    /* reset */
    body,h1,h2,h3,h4,h5,h6,p,form,fieldset {margin:0;padding:0;}
    .low {display:none;}
    /* body */
    body {
      font-family:Arial, Helvetica, sans-serif;

    in css/layout.css, the container element (I tried adding “height:100%;” but no change)

    /* container */
    #container {
      margin:0 auto;

    and in css/spring_flavour.css:

    Tried messing with the 30px white border, but that’s the whitespace above the header image, not the space that’s the bg color between the container and the actual screen edge, obviously.

    /* container */
    #container {
      border-top:30px solid white;

    Is there another part of either css file that could be conflicting with a “margin-top 0px; margin-bottom: 0px;” code? I just don’t understand why that won’t work! I’ve gone and looked at the css files for the site in the graphic that I DID get it to work on, but can’t find any glaring differences between the two. As mentioned in my OP, I did that site so long ago that I don’t remember how I got it to work, but I don’t remember having any problems like I am on this current project.



    Forum Moderator

    A screenshot is of no use. Unfortunately, there’s nothing as good as a link to a page demonstrating the problem.

    The graphic I provided illustrated the problem pretty well, I thought. Here’s a more detailed version to better explain my issue:

    Anyone else have any ideas? I understand that it would be helpful to just click “view source”, but I’m happy to provide any portions of code needed. I will say that from what I can find, there’s nothing in the actual templates that is making the unwanted space, it’s all pretty much controlled in the css files.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Blix Top/Bottom Margin’ is closed to new replies.