Fixed CSS Div overlaps other box

Question

I'm not really a CSS-hero ;-) Well, I try to create a form with bootstrap and some custom css.

I want 3 columns:

Content
Editor
Settings

The Editor should be fixed.

Thats my html: http://d.pr/n/YsVJ

The part of the fixed editor is:

<div class="form-vertical fixed"> <?php echo $this->form->getControlGroup('content'); ?> </div>

I added some custom css like this:

http://d.pr/n/v9EN

Well, it works, the editor is fixed, but there is one problem: If I use my iPad or Netbook the div of the editor overlaps the div of the settings (span3).

How can I solve that?

score 0 · Accepted Answer · answered Jul 17 '14 at 08:42

0

By setting something as fixed it removes it from the flow of the document, which means it won't affect anything else on the page.

You would need to use a margin or padding to create a bit of extra space for the element that is being overlapped and not positioned fixed.

answered Jul 17 '14 at 08:42

Adam Hughes

2,197
20
31

So I have to add margin or padding to the fixed div or to the non-fixed divs? – user3755325 Jul 17 '14 at 08:55
The non-fixed div. You're basically creating a blank space for the fixed div to sit in – Adam Hughes Jul 17 '14 at 10:16

Fixed CSS Div overlaps other box

1 Answers1