Also have div not moving with centered page

14/02/2008, 07h52

I see this has been discussed but the fix seemed somewhat specific to each
person's request. I usually have someone do the coding so I'm a novice. This is
just for a friend and what happens is when I have the page auto center the div
remain static. I have them set to "absolute" but I need them to stick to the
layout no matter where the page ends of horizontally.

I tried putting the centering code in the css - no fix, then on the page code.
Neither fixed it.

Just trying to learn here so apologizes if this is super simple to many of you.

http://www.weinhartdesign.com/index.1.html

14/02/2008, 16h25

You might want to read this essay with your friend -

http://www.losingfight.com/blog/2006...menufw_menujs/

It's bad news for the menu system you have used.

Also, open the page in Firefox, and bump the text size up a bit. That's bad
news for your 'content in layer' approach, too.

You can make your page center by following the suggestion I have posted
hundreds of times, and simply adjusting the width to correspond to your page
layout -

Change this -

</head>

to this -

<style type="text/css">
<!--
body { text-align:center; }
#wrapper { text-align:left; width:760px; margin:0 auto

osition:relative; }
/* 760px will display on an 800px screen maximized browser window without */
/* horizontal scrollbars. */
-->
</style>
</head>

change this -

<body ...>

to this -

<body ...>
<div id="wrapper">

and this -

</body>

to this -


</div>
</body>

and see if that s.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp0rvk$4k8$1@forums.macromedia.com...
>I see this has been discussed but the fix seemed somewhat specific to each
> person's request. I usually have someone do the coding so I'm a novice.
> This is
> just for a friend and what happens is when I have the page auto center the
> div
> remain static. I have them set to "absolute" but I need them to stick to
> the
> layout no matter where the page ends of horizontally.
>
> I tried putting the centering code in the css - no fix, then on the page
> code.
> Neither fixed it.
>
> Just trying to learn here so apologizes if this is super simple to many of
> you.
>
> http://www.weinhartdesign.com/index.1.html
>
>

14/02/2008, 16h52

I'll read the article you provided. I made the changes but I don't know if I did them correctly because nothing changed. I uploaded it again w/changes

14/02/2008, 17h21

Here's the code on the page -

<style type="text/css">
<!--
body { text-align:center; }
#wrapper { text-align:left; width:760px; margin:0 auto

osition:relative; }
/* 760px will display on an 800px screen maximized browser window without */
/* horizontal scrollbars. */
-->
</style>
</head>
<body ...>
<div id="wrapper">

</div>
</body>

<div id="site">

See - you really have have some facility with HTML and CSS to even
understand the suggestions you get here, much less follow them correctly.

Change what you have done to this -

<style type="text/css">
<!--
body { text-align:center; }
#wrapper { text-align:left; width:760px; margin:0 auto

osition:relative; }
/* 760px will display on an 800px screen maximized browser window without */
/* horizontal scrollbars. */
-->
</style>
</head>
<body>
<div id="wrapper">


and at the bottom of the page, change this -

<td colspan="5"><img src="images/home.body.jpg" width="846" height="485"
/></td>
</tr>
</table>
</div>

to this -

<td colspan="5"><img src="images/home.body.jpg" width="846" height="485"
/></td>
</tr>
</table>
</div>
</body>
</html>

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp1rkr$9kt$1@forums.macromedia.com...
> I'll read the article you provided. I made the changes but I don't know if
> I did them correctly because nothing changed. I uploaded it again
> w/changes

14/02/2008, 17h41

admonishment accepted. This did it although one of the layer moved its static
position which I'm sure I can figure out.

As I mentioned I usually can hire someone who does the code. In this case I
have to stumble through it myself.

Thank you again.

14/02/2008, 17h56

OK, I did it and it keeps pushing the page to the right instead of center.

14/02/2008, 18h10

All of the layers have had their point of reference changed from the default
body tag to the relatively positioned div#wrapper, so it makes sense that
you will have to adjust their position on the page. However, you are
adjusting the position relative to that wrapper, now, so once properly set,
it will stay that way.

The page is being offset because the table is wider than the stated width of
the wrapper div -

#wrapper { text-align:left; width:760px;

....

<table width="847" border="0" cellpadding="0" cellspacing="0" >

So, just change the wrapper style to this -

#wrapper { text-align:left; width:847px;

847px may be too wide for many of your visitors to see the whole page
without horizontal scrolling.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp1uff$ceb$1@forums.macromedia.com...
> admonishment accepted. This did it although one of the layer moved its
> static
> position which I'm sure I can figure out.
>
> As I mentioned I usually can hire someone who does the code. In this case
> I
> have to stumble through it myself.
>
> Thank you again.
>

14/02/2008, 18h35

I had noticed the difference in the numbers from your code to this site. I
guess I should've played with it - only worried I would mess up your code.
There was a big discussion as to the size and I looked at many sites and it
appears they're all getting wider and wider. This was a compromise. The
client/friend has a monitor set to high resolution and wanted it to fill that
screen. haha That would've made it 1600 wide of better...

14/02/2008, 18h57

Your site's width does not depend on what widths others choose, it should
depend on the browsing habits of your target demographic. I am still
building sites that support maximized browser viewports on 800x600 screens
without horizontal scrolling. To do that, you need to keep the width at
about the 760px level. Your choice is a curious one, though. It implies
that you are not interested in supporting that configuration, but are also
unwilling to go to the next step which would be to support only maximized
browsers on 1024x768, allowing a width of about 1000px. Anyhow....

> client/friend has a monitor set to high resolution and wanted it to fill
> that
> screen.

See - it's not a resolution decision. It's a browser width decision. And
it's not based on your friend, it's based on your target demographic.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp21m4$fu9$1@forums.macromedia.com...
>I had noticed the difference in the numbers from your code to this site. I
> guess I should've played with it - only worried I would mess up your code.
> There was a big discussion as to the size and I looked at many sites and
> it
> appears they're all getting wider and wider. This was a compromise. The
> client/friend has a monitor set to high resolution and wanted it to fill
> that
> screen. haha That would've made it 1600 wide of better...
>

14/02/2008, 19h06

I understand completely and in the future I will do as you stated. I managed to
get your code into CSS and hope I can center the whole site not too painfully.

I know you're dealing with needy novices all day. This one really appreciates
your kind .

14/02/2008, 19h08

You're welcome. Good luck!

Did you try the width change in the CSS - it should make the difference.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp23fk$hr1$1@forums.macromedia.com...
>I understand completely and in the future I will do as you stated. I
>managed to
> get your code into CSS and hope I can center the whole site not too
> painfully.
>
> I know you're dealing with needy novices all day. This one really
> appreciates
> your kind .
>

14/02/2008, 19h53

Yes, I made the width change in CSS and it fixed it although as you mentioned I
have to change all the tables to align with the new container. I saved template
files so I will have the code examples ready when I do another site. Hopefully
I'll afford P7 menus by then.

14/02/2008, 21h08

Good luck!

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp268f$kuu$1@forums.macromedia.com...
> Yes, I made the width change in CSS and it fixed it although as you
> mentioned I
> have to change all the tables to align with the new container. I saved
> template
> files so I will have the code examples ready when I do another site.
> Hopefully
> I'll afford P7 menus by then.

>

17/02/2008, 03h42

Murray. I can't believe it but I got roped into doing another site for a close
friend who's bugged me for 6 years. It would mean text over a background like
the one here. If using layers (div) is a no-no then what would you suggest?

If you want to point me to a book or training tape that's cool too. I've spent
many hours on Lynda.com although hard to learn specific design solutions

17/02/2008, 13h46

Why would it mean text over a background? Like the one where?

Ordinarily trying to align text with a background image is a VERY poor
method, since changes in the local browser's text size will change the
alignment.

For HTML/CSS learning, I'd recommend starting here -

http://www.w3schools.com

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp8afg$c93$1@forums.macromedia.com...
> Murray. I can't believe it but I got roped into doing another site for a
> close
> friend who's bugged me for 6 years. It would mean text over a background
> like
> the one here. If using layers (div) is a no-no then what would you
> suggest?
>
> If you want to point me to a book or training tape that's cool too. I've
> spent
> many hours on Lynda.com although hard to learn specific design solutions
>

17/02/2008, 17h07

Thanks again. I'll check all of them out.

15/03/2008, 23h49

Trying to align text with a background image is going to be a futile
endeavor. I would walk away from a design that required me to do that, or
find another way to design it.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"phrarod" <webforumsuser@macromedia.com> wrote in message
news:fp8afg$c93$1@forums.macromedia.com...
> Murray. I can't believe it but I got roped into doing another site for a
> close
> friend who's bugged me for 6 years. It would mean text over a background
> like
> the one here. If using layers (div) is a no-no then what would you
> suggest?
>
> If you want to point me to a book or training tape that's cool too. I've
> spent
> many hours on Lynda.com although hard to learn specific design solutions
>

14/02/2008, 07h52	#1
phrarod Messages: n/a Hébergeur:	Also have div not moving with centered page I see this has been discussed but the fix seemed somewhat specific to each person's request. I usually have someone do the coding so I'm a novice. This is just for a friend and what happens is when I have the page auto center the div remain static. I have them set to "absolute" but I need them to stick to the layout no matter where the page ends of horizontally. I tried putting the centering code in the css - no fix, then on the page code. Neither fixed it. Just trying to learn here so apologizes if this is super simple to many of you. http://www.weinhartdesign.com/index.1.html

14/02/2008, 16h25	#2
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page You might want to read this essay with your friend - http://www.losingfight.com/blog/2006...menufw_menujs/ It's bad news for the menu system you have used. Also, open the page in Firefox, and bump the text size up a bit. That's bad news for your 'content in layer' approach, too. You can make your page center by following the suggestion I have posted hundreds of times, and simply adjusting the width to correspond to your page layout - Change this - </head> to this - <style type="text/css"> <!-- body { text-align:center; } #wrapper { text-align:left; width:760px; margin:0 autoosition:relative; } /* 760px will display on an 800px screen maximized browser window without / / horizontal scrollbars. / --> </style> </head> change this - <body ...> to this - <body ...> <div id="wrapper"> and this - </body> to this - <!-- /wrapper --> </div> </body> and see if that s. -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST* email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp0rvk$4k8$1@forums.macromedia.com... >I see this has been discussed but the fix seemed somewhat specific to each > person's request. I usually have someone do the coding so I'm a novice. > This is > just for a friend and what happens is when I have the page auto center the > div > remain static. I have them set to "absolute" but I need them to stick to > the > layout no matter where the page ends of horizontally. > > I tried putting the centering code in the css - no fix, then on the page > code. > Neither fixed it. > > Just trying to learn here so apologizes if this is super simple to many of > you. > > http://www.weinhartdesign.com/index.1.html > >

14/02/2008, 16h52	#3
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page I'll read the article you provided. I made the changes but I don't know if I did them correctly because nothing changed. I uploaded it again w/changes

14/02/2008, 17h21	#4
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Here's the code on the page - <style type="text/css"> <!-- body { text-align:center; } #wrapper { text-align:left; width:760px; margin:0 autoosition:relative; } /* 760px will display on an 800px screen maximized browser window without / / horizontal scrollbars. / --> </style> </head> <body ...> <div id="wrapper"> <!-- /wrapper --> </div> </body> <div id="site"> See - you really have have some facility with HTML and CSS to even understand the suggestions you get here, much less follow them correctly. Change what you have done to this - <style type="text/css"> <!-- body { text-align:center; } #wrapper { text-align:left; width:760px; margin:0 autoosition:relative; } / 760px will display on an 800px screen maximized browser window without / / horizontal scrollbars. / --> </style> </head> <body> <div id="wrapper"> <!-- /wrapper --> and at the bottom of the page, change this - <td colspan="5"><img src="images/home.body.jpg" width="846" height="485" /></td> </tr> </table> </div> to this - <td colspan="5"><img src="images/home.body.jpg" width="846" height="485" /></td> </tr> </table> </div> </body> </html> -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST* email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp1rkr$9kt$1@forums.macromedia.com... > I'll read the article you provided. I made the changes but I don't know if > I did them correctly because nothing changed. I uploaded it again > w/changes

14/02/2008, 17h41	#5
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page admonishment accepted. This did it although one of the layer moved its static position which I'm sure I can figure out. As I mentioned I usually can hire someone who does the code. In this case I have to stumble through it myself. Thank you again.

14/02/2008, 17h56	#6
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page OK, I did it and it keeps pushing the page to the right instead of center.

14/02/2008, 18h10	#7
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page All of the layers have had their point of reference changed from the default body tag to the relatively positioned div#wrapper, so it makes sense that you will have to adjust their position on the page. However, you are adjusting the position relative to that wrapper, now, so once properly set, it will stay that way. The page is being offset because the table is wider than the stated width of the wrapper div - #wrapper { text-align:left; width:760px; .... <table width="847" border="0" cellpadding="0" cellspacing="0" > So, just change the wrapper style to this - #wrapper { text-align:left; width:847px; 847px may be too wide for many of your visitors to see the whole page without horizontal scrolling. -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp1uff$ceb$1@forums.macromedia.com... > admonishment accepted. This did it although one of the layer moved its > static > position which I'm sure I can figure out. > > As I mentioned I usually can hire someone who does the code. In this case > I > have to stumble through it myself. > > Thank you again. >

14/02/2008, 18h35	#8
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page I had noticed the difference in the numbers from your code to this site. I guess I should've played with it - only worried I would mess up your code. There was a big discussion as to the size and I looked at many sites and it appears they're all getting wider and wider. This was a compromise. The client/friend has a monitor set to high resolution and wanted it to fill that screen. haha That would've made it 1600 wide of better...

14/02/2008, 18h57	#9
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Your site's width does not depend on what widths others choose, it should depend on the browsing habits of your target demographic. I am still building sites that support maximized browser viewports on 800x600 screens without horizontal scrolling. To do that, you need to keep the width at about the 760px level. Your choice is a curious one, though. It implies that you are not interested in supporting that configuration, but are also unwilling to go to the next step which would be to support only maximized browsers on 1024x768, allowing a width of about 1000px. Anyhow.... > client/friend has a monitor set to high resolution and wanted it to fill > that > screen. See - it's not a resolution decision. It's a browser width decision. And it's not based on your friend, it's based on your target demographic. -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp21m4$fu9$1@forums.macromedia.com... >I had noticed the difference in the numbers from your code to this site. I > guess I should've played with it - only worried I would mess up your code. > There was a big discussion as to the size and I looked at many sites and > it > appears they're all getting wider and wider. This was a compromise. The > client/friend has a monitor set to high resolution and wanted it to fill > that > screen. haha That would've made it 1600 wide of better... >

14/02/2008, 19h06	#10
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page I understand completely and in the future I will do as you stated. I managed to get your code into CSS and hope I can center the whole site not too painfully. I know you're dealing with needy novices all day. This one really appreciates your kind .

14/02/2008, 19h08	#11
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page You're welcome. Good luck! Did you try the width change in the CSS - it should make the difference. -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp23fk$hr1$1@forums.macromedia.com... >I understand completely and in the future I will do as you stated. I >managed to > get your code into CSS and hope I can center the whole site not too > painfully. > > I know you're dealing with needy novices all day. This one really > appreciates > your kind . >

14/02/2008, 19h53	#12
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Yes, I made the width change in CSS and it fixed it although as you mentioned I have to change all the tables to align with the new container. I saved template files so I will have the code examples ready when I do another site. Hopefully I'll afford P7 menus by then.

14/02/2008, 21h08	#13
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Good luck! -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp268f$kuu$1@forums.macromedia.com... > Yes, I made the width change in CSS and it fixed it although as you > mentioned I > have to change all the tables to align with the new container. I saved > template > files so I will have the code examples ready when I do another site. > Hopefully > I'll afford P7 menus by then. >

17/02/2008, 03h42	#14
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Murray. I can't believe it but I got roped into doing another site for a close friend who's bugged me for 6 years. It would mean text over a background like the one here. If using layers (div) is a no-no then what would you suggest? If you want to point me to a book or training tape that's cool too. I've spent many hours on Lynda.com although hard to learn specific design solutions

17/02/2008, 13h46	#15
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Why would it mean text over a background? Like the one where? Ordinarily trying to align text with a background image is a VERY poor method, since changes in the local browser's text size will change the alignment. For HTML/CSS learning, I'd recommend starting here - http://www.w3schools.com -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp8afg$c93$1@forums.macromedia.com... > Murray. I can't believe it but I got roped into doing another site for a > close > friend who's bugged me for 6 years. It would mean text over a background > like > the one here. If using layers (div) is a no-no then what would you > suggest? > > If you want to point me to a book or training tape that's cool too. I've > spent > many hours on Lynda.com although hard to learn specific design solutions >

17/02/2008, 17h07	#16
phrarod Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Thanks again. I'll check all of them out.

15/03/2008, 23h49	#17
Murray ACE Messages: n/a Hébergeur:	Re: Also have div not moving with centered page Trying to align text with a background image is going to be a futile endeavor. I would walk away from a design that required me to do that, or find another way to design it. -- Murray --- ICQ 71997575 Adobe Community Expert (If you MUST email me, don't LAUGH when you do so!) ================== http://www.projectseven.com/go - DW FAQs, Tutorials & Resources http://www.dwfaq.com - DW FAQs, Tutorials & Resources ================== "phrarod" <webforumsuser@macromedia.com> wrote in message news:fp8afg$c93$1@forums.macromedia.com... > Murray. I can't believe it but I got roped into doing another site for a > close > friend who's bugged me for 6 years. It would mean text over a background > like > the one here. If using layers (div) is a no-no then what would you > suggest? > > If you want to point me to a book or training tape that's cool too. I've > spent > many hours on Lynda.com although hard to learn specific design solutions >

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email