absolute positioning

iam_clint

Ok so I don't normally ask questions but heres my question.


How can I get this div to be in that position on my page no matter if the window is not maximized and on different resolutions. position relative doesn't seem to work for me because it adds extra space when this becomes visible and i don't want that so any thoughts would help out thanks.

Its a drop down that shows up under search box but when screen reso changes it moves on the page ... i think you get what i mean yes its still at 186 from the top and 287 from the left but the rest of my crap on my page isn't right there anymore cause resolution changed or the window size changed.

Apr 24 '07 #1

drhowarddrfine

Without seeing the rest of the markup I don't know if this will work for you but let me know:
You need units on the sizes such as 'px' and I changed your positioning to absolute. That may do what you want but it can be tricky depending on the rest of the markup.

Apr 24 '07 #2

iam_clint

this does not work, when i change the resolution on my computer or unmaximize the window it moves the div from where its supposed to be because from the top left corner of the browser it is not the same PX as before to where the div should be.

you don't want to see the rest of the markup :P

I just need a way other than position absolute to get this div not to shift things around on the page and overlay everything where i put it.

Apr 25 '07 #3

iam_clint

Heres a link to the test page - [link removed at posters request]
at resolution 1280/1024 with browser maximized

in the search on the left start typing monkey the div will popup with some autocomplete options. Looks fine at this reslution? right.... change resolutions or unmaximize the window.

-- edit: The page has not yet been tested in firefox, Will fix it for firefox if anything is wrong after i get the positioning to work correctly --

Apr 25 '07 #4

iam_clint

i tried to write some javascript to overcome this problem but its a pain..

Apr 25 '07 #5

drhowarddrfine

You mean the autocomplete isn't popping up in the right place? Everything else seems right in FF and IE7. In any case, you have 95 html errors and 10 or more CSS errors including no doctype which is required. Validate both for that list of errors but I'm not sure I understand the problem.

Apr 26 '07 #6

drhowarddrfine

I think I understand now. Assuming you are talking of the autocomplete popup, you would need to move that <div> inside the div or table cell where the search box is. Then position #commonsearch relative to the inside of that div or table cell. Now, that requires the div/table cell to be "position:relative" which will force #commonsearch to use it as its parent element for positioning.

Does that make sense?

Apr 26 '07 #7

iam_clint

it does make sense but even when i do this when the div becomes visible when i do it without using position absolute it pops up and pushes everything else down and to the right.

Apr 26 '07 #8

drhowarddrfine

Which browser? I don't see this "pushing around" problem in FF or IE7.

Apr 26 '07 #9

iam_clint

Well i wrote some javascript to position it with absolute in about the same area on every resolution, i'm talking about for example here

you can put this code in [link removed as posters request]
paste it in there and click update and down at the bottom click the test button.
[HTML]
<table>
<tr><td>This will stay in the correct place</td></tr>
<tr><td><div id="test" style="position: relative; top: -5px; width: 50px; height: 50px; visibility: hidden; display: none;">Example</div></td></tr>
<tr><td>This is going to be pushed down</td></tr>
</table>
<input type="button" onclick="document.getElementById('test').style.dis play = 'block'; document.getElementById('test').style.visibility = 'visible';" value="Test">
[/HTML]

Apr 26 '07 #10

drhowarddrfine

That test page is unviewable in Firefox and doesn't work in Opera. I don't have a Windows box available right now.

Apr 26 '07 #11

iam_clint

That test page is unviewable in Firefox and doesn't work in Opera. I don't have a Windows box available right now.

well paste it an .html document and open it in firefox

Apr 26 '07 #12

drhowarddrfine

So maybe I'm losing touch with the problem but just change relative to absolute.

Apr 26 '07 #13

KevinADC

it does make sense but even when i do this when the div becomes visible when i do it without using position absolute it pops up and pushes everything else down and to the right.

Works fine for me too, IE6, IE7, FF 2 (windows 98 test server)

no change to layout when resoultion is changed, everything stays in position as it should.

Apr 26 '07 #14