Fixed Background Help

Guys,

Im pretty new to Dreamweaver and am having some problems designing a website.

I am wanting to have a fixed background and then a square box with my content
in. I dont want the background to move when I scroll down the page, but I do
want the box with my content to scroll.

Any ideas how I can do this?

Next question... how come when I design a page in Dreamweaver, when I view it
in IE its positioned completely different? i.e. I centre a picture in
Dreamweaver and when I view it in IE its in the top left hand corner etc its
very random

Thanks in advance

I am wanting to have a fixed background and then a square box with my
content
in. I dont want the background to move when I scroll down the page, but I
do
want the box with my content to scroll.

The fixed background is simple, but if only the content region is scrolling,
why do you need a fixed background.

However, putting content into a scrolling region like that is usually a bad
idea -

1. It's user unfriendly - adding another vertical scrollbar can be
confusing *and* troublesome.
2. The content area will not print fully (only the visible region can
print) unless you add a print stylesheet to the page.
3. This content is usually the most important copy on your page - why force
someone to scroll to read it?

Next question... how come when I design a page in Dreamweaver, when I view
it
in IE its positioned completely different?

It's because "Im pretty new to Dreamweaver".

Show us your code, and we'll tell you why this is happening. The truth of
the matter is this - it's always in the code. If you don't feel comfortable
looking at your code, then DW will be an exercise in frustration for you.
The best way to get un-frustrated would be to spend some time 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
==================


"Martin.Maggiore" <webforumsuser (AT) macromedia (DOT) com> wrote

Guys,

Im pretty new to Dreamweaver and am having some problems designing a
website.

I am wanting to have a fixed background and then a square box with my
content
in. I dont want the background to move when I scroll down the page, but I
do
want the box with my content to scroll.

Any ideas how I can do this?

Next question... how come when I design a page in Dreamweaver, when I view
it
in IE its positioned completely different? i.e. I centre a picture in
Dreamweaver and when I view it in IE its in the top left hand corner etc
its
very random

Thanks in advance

Murray *ACE* wrote:

I am wanting to have a fixed background and then a square box with my
content
in. I dont want the background to move when I scroll down the page,
but I do
want the box with my content to scroll.

The fixed background is simple, but if only the content region is
scrolling, why do you need a fixed background.

I think what they mean is they want the content to scroll 'normally' not
in a scrolling <div> but the background to remain static.

However either I'm getting old or the whole world is going mad because
lately I can't understand about 80% of the posts in this forum

However either I'm getting old or the whole world is going mad because
lately I can't understand about 80% of the posts in this forum

I share this sentiment, and think it's likely that both are true!

and then a square box with my content in. I dont want the background to
move when I scroll down the page, but I do want the box with my content to
scroll.

Sure sounds like a scrolling region to me....

--
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
==================


"Osgood" <notavailable (AT) thisaddress (DOT) com> wrote

Murray *ACE* wrote:
I am wanting to have a fixed background and then a square box with my
content
in. I dont want the background to move when I scroll down the page, but
I do
want the box with my content to scroll.

The fixed background is simple, but if only the content region is
scrolling, why do you need a fixed background.

I think what they mean is they want the content to scroll 'normally' not
in a scrolling <div> but the background to remain static.

However either I'm getting old or the whole world is going mad because
lately I can't understand about 80% of the posts in this forum

Thanks for your help so far...

Im making a photography website, here is the design so far

Home Page -
http://i152.photobucket.com/albums/s...e/HomePage.jpg

Gallery -
http://i152.photobucket.com/albums/s...lleryPage1.jpg

the Home Page doesnt need to scroll at all, it just needs to sit exactly like
that, as if that was the full page.

the gallery however, with it going lengthways, will need to scroll to view the
images, however I dont want the background to move with it.

as an example, please see http://www.sophiepickard.co.uk/webgallery1.php

You may need to copy and paste the links above manually

Any help would be appreciated...

Thanks

Martin.Maggiore wrote:

Thanks for your help so far...

Im making a photography website, here is the design so far

Home Page -
http://i152.photobucket.com/albums/s...e/HomePage.jpg

Gallery -
http://i152.photobucket.com/albums/s...lleryPage1.jpg

the Home Page doesnt need to scroll at all, it just needs to sit exactly like
that, as if that was the full page.

the gallery however, with it going lengthways, will need to scroll to view the
images, however I dont want the background to move with it.

as an example, please see http://www.sophiepickard.co.uk/webgallery1.php

You may need to copy and paste the links above manually

Any help would be appreciated...

Thanks

So I was correct in my diagnosis and Murray was wrong lol. (well he is a
pensioner so he can be forgiven)

All you need to do is use background-attachment: fixed; on the 'body'
tag as seen below:

This is taken from the site you refer to above and why the background
remains static and the foreground scrolls.

body {
background-image:url(../imgs/background2.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
background-color:#3F3F3E;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
margin-top: 20px;
}

I did think that was the case but I was having issues with the positioning when
I did that.

I think part of the problem is the design of the background.

Out of curiosity, when making a web page... what size/dimensions do you set
your page?

I make my websites first in photoshop and then slice them into Dreamweaver

Out of curiosity, when making a web page... what size/dimensions do you
set
your page?

To make your decision you need to have some ideas about the following
issues -

1. What is the primary target demographic for this site?
2. What are the browsing habits of that demographic? Do they normally have
their browser window maximized on the screen?
3. If they usually have their browser maximized, what is the typical screen
width?
4. If they usually do NOT have their browser maximized, what is the MINIMUM
screen width in that demographic.
5. How do I want to build the page?
a. Fixed width and left aligned?
b. Fixed width and centering?
c. Flexible to fill whatever width from left to right?
d. Flexible (within limits) and left aligned?
e. Flexible (within limits) and centering?

As you can see, this decision is probably much more complex than you
thought, and will require that you know quite a bit about your intended
target visitor and their browsing habits.

If you elect to go with 5a, or 5b, then your decision would be - 'what is
the mimimum browser width I want to support without horizontal scrolling?'.
Once you have determined that minimum supported width, all of your decisions
are made. That's how wide you want your page to be.

If you elect to go with 5c, then you just build your page within a flexible
container (the simplest example - although an obsolet one - would be to use
a 100% width table to hold the entire page). Be aware that pages with
limited text content can look VERY sparse and empty on wide viewports when
built in this way.

If you elect to go with 5d, or 5e, then you would add this sophistication to
your decision matrix -

'what is the greatest width I want to allow the page and its contents to
become?'

In this case, you would use the CSS styles - 'min-width' and 'max-width' on
the primary page container. Just so you'll know, although these styles are
well supported *now*, earlier versions of IE (and some other browsers) will
not support them so reliably.

So - which is it? 8)
--
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
==================


"Martin.Maggiore" <webforumsuser (AT) macromedia (DOT) com> wrote

I did think that was the case but I was having issues with the positioning
when
I did that.

I think part of the problem is the design of the background.

Out of curiosity, when making a web page... what size/dimensions do you
set
your page?

I make my websites first in photoshop and then slice them into Dreamweaver

Martin.Maggiore wrote:

I did think that was the case but I was having issues with the positioning when
I did that.

I think part of the problem is the design of the background.

Out of curiosity, when making a web page... what size/dimensions do you set
your page?

Personally mine (when I do them, which is not often) are around 760px
wide for a fixed width although I think this is changing now that new
computers ship with high screen resolutions as default.

Its really all about how wide the end user has their browser viewport
set to and you cannot determine that. All that is happening at the
moment is designers are setting wider widths because of screen resolution.

Take the bcc.co.uk site for instance that's now nearly 1000px fixed width.

I make my websites first in photoshop and then slice them into Dreamweaver

Sounds ok to me.

Malcolm _ wrote:

On Tue, 15 Jul 2008 14:49:23 +0100, Osgood
notavailable (AT) thisaddress (DOT) com> wrote:


Take the bcc.co.uk site for instance that's now nearly 1000px fixed width.




given that you really mean the bbc.co.uk/ website - :-))
yes it is
and a great shame too as I know many people with computers / screens
which means they have to use the scroll bar.

Yes, me too, unless I pull the browser window open wider. But then again
I can set my screen resolution to something a little higher and can then
fit the page in a narrower browser window.

I don't think there is really any definitive way to determine the best
solution.......you just choose one and keep your fingers crossed and arm
yourself with a cart load of lot of bullsh_t if the client asks questions.