Home/ Questions/Q 8845739
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T11:48:21+00:00

I can’t find a clear answer on the following: I have this html: <html>

  • 0

I can’t find a clear answer on the following:

I have this html:

<html>
<head>
    <title>Title blabla</title>
</head>

<body>
    <div id="gHeader">
    </div>
    <div id="gBody">
    </div>
</body>
</html>

gHeader is the header part, this is where the menu goes, gBody is the body part, this is where everything else goes.

When I get a lot of content in gBody, more than can fit on the screen, a scrollbar appears on the right. Problem is that this scrollbar pushes gHeader a bit to the left.

The solution I’m searching for is that when a scrollbar appears, it only appears in gBody, and not partly on gHeader.

I don’t want a scrollbar to influence the look and feel of my header. Especially because a part of my menu starts from the right. Is this possible?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You would need to manually set the height of the content area, and use overflow:auto. Something like this might work:

    #gHeader {
    position: fixed;
    left: 0; top: 0; right: 0; height: 150px;
}
#gBody {
    position: fixed;
    left: 0; top: 150px; right: 0; bottom: 0;
    overflow: auto;
}
    • 0