Tim Tim - 2 years ago 69
Javascript Question

Absolute positioning not working on Javascript DIV

I've used some Javascript that slides a DIV up from the bottom of the webpage and I've tried to position it absolute bottom center.

The DIV at the bottom seems to be bottom left and I've tried to have it centered no matter what the browser window size is.

I'd have a look at this URL to see the page in question: http://s361608839.websitehome.co.uk/oneonly/index.html


<div class="slide-out-div">
<a class="handle" href="http://link-for-non-js-users">Content</a>
<a href="mailto:name@domain.com">name@domain.com</a><br /><br />


.slide-out-div {
padding: 20px;
width: 276px;
background: url(images/kontakt-bg.png);
color: #fff;


tabHandle: '.handle', //class of the element that will be your tab
pathToTabImage: 'images/kontakt-tab.png', //path to the image for the tab (optionaly can be set using css)
imageHeight: '26px', //height of tab image
imageWidth: '316px', //width of tab image
tabLocation: 'bottom', //side of screen where tab lives, top, right, bottom, or left
speed: 300, //speed of animation
action: 'click', //options: 'click' or 'hover', action to trigger animation

fixedPosition: false //options: true makes it stick(fixed position) on scroll


Ana Ana
Answer Source


left: 50%;
margin-left: -138px; /* half its width which you have set to be 276px */

to .slide-out-div (works for me when editing live via developer tools).

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download