Forums

siouxfan45

See the problem here: http://themeforward.com/demo2/

On the bottom of #index (in black), directly under .pagination (the newer/older links in blue) there is an extra pixel. It appears #index has an extra pixel of space being added when .pagination is set inside it. I'm unsure how to eliminate this extra pixel and would appreciate any help.

  #index {
    float:left;
    background:#000;
    width:630px
  }
    .pagination {
      padding:2em 0;
      clear:both;
      width:100%
    }
    .pagination a {
      background:#3300FF;
      padding:2em
    }
    #pagination .current { background:#DDD }

chrisburton

Try this:

  .pagination {
      padding: 5% 0;
  }

siouxfan45

That doesn't get rid of the extra pixel. .pagination has to match the padding of .pagination a - even if I switch both to percentages the extra pixel margin still exists.

chrisburton

Weird. It worked for me.

siouxfan45

My browser apparently didn't refresh the page. For this to work I have to add a 1px margin to the top for it to line up properly which isn't a big deal, but I wonder why this is.

chrisburton

I tried adding overflow: hidden but that didn't solve the issue. If you add 5.025%, it works.

siouxfan45

Thanks Chris.

treehouse : what would you like to learn today?

Forums

[Solved] Can't Eliminate Extra Pixel