Prev: Spry Collapsable Panel Not Working
Next: Transparent Spry Menu Bar
From: dsproul on 5 May 2008 19:19
How do I get a DIV to line itself up with the web page edge, instead of the
browser window? Resizing the window moves the divs. I read something in the
forum about setting a fixed page width. Would that solve it? If yes, please
advise how to do it.

LInk: http://www.sproulcreative.com/filetest/criticalcare/doctors1_4.html
CSS links:
http://www.sproulcreative.com/filetest/criticalcare/criticalcare_style.css
Thanks.

From: TC2112 on 5 May 2008 21:23
Hello,

The absolutely positioned div with the images is positioned 30px from the
right side of the browser window.
It will always move with the right edge of the browser window when resized,
staying 30px from the edge.
Just change this AP div so it is positioned 800px from the left side of the
browser window.
Then, the images will always be 5px to the right edge of your table (table
is 770px + 25px left margin = 795px), even if the browser window is resized.

Change this:

/* This style is for the side bar photos on the doctors feature pages, with
4 doctors per page. In sep div. */
#bodysidebar_photos_doctorslg {
margin: 0px;
padding: 0px;
width: 144px;
position: absolute;
top: 190px;
border-top-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-style: none;
right: 30px;
text-align: right;
}

To This:

#bodysidebar_photos_doctorslg {
margin: 0px;
padding: 0px;
width: 144px;
position: absolute;
top: 190px;
border-top-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-style: none;
left: 800px;
text-align: right;
}

Of course, this causes a horizontal scrollbar in browser windows of 800px
wide or less now that the page is ~840px wide (table + margin + AP div with
images).

One option to avoid a horizontal scrollbar in windows less than 800px is to
combine the two images into 1 image, then apply them as the background image
for the body.
Use CSS to position the image.
For example:

body {
background-image: url(images/mypicture.jpg);
background-repeat: no-repeat;
background-position: 800px 250px;
}

Take care,
Tim


"dsproul" <webforumsuser(a)macromedia.com> wrote in message
news:fvo4mk$lf4$1(a)forums.macromedia.com...
> How do I get a DIV to line itself up with the web page edge, instead of
> the
> browser window? Resizing the window moves the divs. I read something in
> the
> forum about setting a fixed page width. Would that solve it? If yes,
> please
> advise how to do it.
>
> LInk: http://www.sproulcreative.com/filetest/criticalcare/doctors1_4.html
> CSS links:
> http://www.sproulcreative.com/filetest/criticalcare/criticalcare_style.css
> Thanks.
>


From: JS_BlueDragonfly on 6 May 2008 17:45
Thanks, TIm. I happened to do the same thing this morning- align left. Fixes
are easier with a fresh brain.

Thanks also for the code to fix the scroll bar. I'll have to look at that, and
I appreciate you providing it.

Thanks.

 | 
Pages: 1
Prev: Spry Collapsable Panel Not Working
Next: Transparent Spry Menu Bar