strange white line

When I try the following script:

http://jsfiddle.net/mYx5y/23/

I get a strange开发者_开发知识库 white line in the background instead of it all being gray.

Why is this happening?

---

This happens in all browsers, not just IE8. Slightly misleading question.

You need to add overflow: hidden to #tabs to clear the floats - demo.

If you want the white gone, also add background: none - demo.

---

it's the padding of your #tabs div. Change the padding-top: 10px; to margin-top: 10px; and it's gone.

-edit-

You're right: That's because of the padding that's still set to 10px for all sides. Set the padding and margin of #tabs as follows:

padding:10px;
padding-top:0;
margin-top:20px;
padding-bottom:0px

The white line will disappear.

---

Try changing the padding for #tabs to 0...

#tabs { border:none; padding:0px; padding-top:0px; padding-bottom:0px;  }

---

It's coming from the jquery-ui.css file (line 62). Just override it with

.ui-widget-content { background:transparent; }
.portlet-content { background-color:#fff; }

Demo: http://jsfiddle.net/Marcel/NA9Xx/2/