You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

1

Monday, May 19th 2014, 10:39am

[SOLVED] Div overlay takes up full width issue

Hi

I have a div, called #panel, that is overlayed on top of the krpano. I've set a width and height on #panel, but a big black background, which is the same height as the #panel div, stretches the with of the page.

See the Div-over-pano.png attachment a screenshot of the problem

Here is my html code

Source code

1
2
3
<div id="panel">
    <p>Hello World</p>
</div>


and my CSS

Source code

1
2
3
4
5
6
7
8
9
10
11
12
#panel
{
    background: #ffffff;
    padding: 5px;
    width: 250px;
    height: 250px;
}

#panel p
{
    color: #000000;
}


UPDATE:

My div was pushing the pano down, hence the black background stretching the width of the screen.
Here is my updated CSS code that fixed the problem

Source code

1
2
3
4
5
6
7
8
9
#panel
{
    background: #fff;
    padding: 5px;
    width: 250px;
    height: 250px;
    position: absolute;
    z-index: 1;
}
bjorntheart has attached the following image:
  • Div-over-pano.png

This post has been edited 1 times, last edit by "bjorntheart" (May 19th 2014, 11:51am)