PDA

View Full Version : Why does my site move about??


Kinetik
04-26-2010, 12:42 PM
Hi everyone,

Im hoping someone can help me, I have made a site

www.stuartmyers.co.uk/navevo

but as you can see the site moves slightly to the left or to the right when browsing the pages, when open on dreamweaver they are all identical and i'm not sure how to get by it other than starting again with a template and hoping it doesn't reoccur. :confused:

If anyone can see why and help me out it would be much appreciated.

Thanks

Corrosive
04-26-2010, 12:50 PM
Because some pages have scroll bars and some don't. Scroll bars will add about 10 pixels to the page so it 'shifts' everything over by that much.

Kinetik
04-26-2010, 01:39 PM
haha so it is, can't believe I didn't notice that!:lol:

Thanks for that corrosive, what would be your work around for this?

1. move non scrolling pages to the right to compensate

2. add blank space to non scrolling pages to create one

3. anything else that would work? as obv adding blank space to pages that dont need it might look odd.

Thanks in advance

DWcourse
04-26-2010, 01:44 PM
Why do you feel the need to "fix" it?

Kinetik
04-26-2010, 01:45 PM
Because my client doesn't like it jumping around when browsing the site. :???:

I think i agree with them though.

DWcourse
04-26-2010, 01:51 PM
I've been told this CSS works but I haven't tried it:

html {
height: 100%;
margin-bottom: 1px;
}

Corrosive
04-26-2010, 01:56 PM
I've been told this CSS works but I haven't tried it:

html {
height: 100%;
margin-bottom: 1px;
}

Yes, never thought of that. Let us know how you get on.

I'd agree with DWCourse though. It doesn't need 'fixing' in my mind. It's just one of those things that happen. Don't ever let design dictate content. Content is king!

Kinetik
04-27-2010, 12:25 PM
thanks DW for the code. I currently have a styles.css file i created for the background, do i add

html {
height: 100%;
margin-bottom: 1px;
}

to that, or create a new one? also how do i get the pages the refer to that?
am very new to css, you'll have to forgive me :)

DWcourse
04-27-2010, 12:33 PM
you can place it in the existing CSS file. If the existing CSS file is already attached (or linked) to your page, then the page will use the new style automatically.

Kinetik
04-27-2010, 12:36 PM
Ok, i added it to the bottom of my styles.css file, and the page still jigs about? it currently looks like this: any ideas?

body {
background-image: url(images/bg.jpg);

background-repeat: repeat-y;
background-position: center;
background-color: #f7f4ee;

}

html {
height: 100%;
margin-bottom: 1px;
}

Kinetik
04-28-2010, 12:52 PM
on all pages it has

<link href="styles.css (http://www.dreamweaverclub.com/forum/view-source:file:///C:/Documents%20and%20Settings/Administrator/My%20Documents/Navevo%20Web/styles.css)" rel="stylesheet" type="text/css" />

in the header, and the styles.css is the post above. the background is still working mind

Corrosive
04-28-2010, 12:54 PM
Have you tried adding the styles to the body css rather than the html? << wild guess btw? ;)

Kinetik
04-28-2010, 12:59 PM
sorry mate not following :confused:

my .css document is:

body {
background-image: url(images/bg.jpg); /** Link to the image you created **/
background-repeat: repeat-y; /** Repeats the image vertically **/
background-position: center; /** Centers the Background image **/
background-color: #f7f4ee; /** Website BG colour (matches canvas colour in Step 1) **/
}

html {
height: 100%;
margin-bottom: 1px;
}

the html on all pages includes

<link href="styles.css (http://www.dreamweaverclub.com/forum/view-source:file:///C:/Documents%20and%20Settings/Administrator/My%20Documents/Navevo%20Web/styles.css)" rel="stylesheet" type="text/css" />

in the header of all pages, as the background is working i'd assume its finding it ok etc, sorry if im missing something obvious! :roll:

Corrosive
04-28-2010, 01:02 PM
OK, sorry. I meant as in this...


body {
background-image: url(images/bg.jpg);

background-repeat: repeat-y;
background-position: center;
background-color: #f7f4ee;
height: 100%;
margin-bottom: 1px;

}



...and drop the HTML bit.

As I say, it is a wild guess but I'd tend not to try and style the html tag.

Kinetik
04-28-2010, 01:23 PM
works like a charm!

thanks ever so much Corrosive :grin:

i'm sure ill be back with another conundrum at some point ;-)

Corrosive
04-28-2010, 01:31 PM
That's my good deed done for the day then ;)

At some stage we'll have to ween you off 'Save as HTML' in Photoshop and tables but we can save that for another time. Glad it works :)

Kinetik
04-28-2010, 02:01 PM
:roll: doing it that way has been a headache from the word go..

the original site was slices from illustrator, but scrapped the majority of it and continued in dreamweaver. maybe should of started it from scratch instead

cheers again

Corrosive
04-28-2010, 02:16 PM
:roll: doing it that way has been a headache from the word go..



Yeah, I bet.

Corrosive
04-28-2010, 02:28 PM
By the way, if you ever want a primer on CSS web builds then get in touch through my site (first in my sig)