Horizontal scrollbar at bottom of screen

Topic

New Reply

For some odd reason there appears to be a scroll bar appearing at the bottom of the body of the site when l click on the contact link when l am in the calder page.

Does anyone have any ideas as to what is causing this?

http://clubamigos.port5.com/scrollbar_screenshot.jpg%5B/url%5D

Reply | Quote

Replies

Not without the code to your page.

Things to check first though:

1) Is the resolution of your screen smaller than the width of you page?

2) Have you introduced a script in your page?

Reply | Quote

Not without the code to your page.
I response to your questions:

1) Is the resolution of your screen smaller than the width of you page? I don’t think so

2) Have you introduced a script in your page? No script.
see attacthment for html and css files.

Any help would be appreciated.

Reply | Quote

[indent]

---

Any help would be appreciated

---

[/indent]I sure hope you give Jezza some credit on your pages once released, seeing all the personal and free effort Jezza put into your site, right

Reply | Quote

I notice that there’s a combination of absolute and relative sizing being used; in your navcal items, there are fixed borders and the LI A item has a fixed width of 61px. It could be that the sum of all these borders and fixed-width items is wider than your browser window.

Reply | Quote

How do you suggest l resolve the problem?
it only appears to be on the caldner page for some odd reason.

Reply | Quote

That makes sense, as it’s probably only the calendar page that has all those fixed-size items in it. Your options are to reduce the size of some of your items (I think it’s the months at the top that cause the problem) or just live with it. After all, you have no idea how big or small the browser window of each of your visitors is going to be, so inevitably some of them will see scrollbars and others won’t. It’s not really a big deal.

Reply | Quote

I will have to live with it , thanks for your feedback.

Reply | Quote

Another thing to assist you is maybe change the css file so that body reads:

body {
   font : 12px "Lucida Sans Unicode", Verdana, sans-serif;
   color : #333333;
   background: #e9eef4;
   width : 100%;
   padding:0px;
   margin:0px;
}

This may alleviate the problem as the is a default 10px margin on the page.

You may also want to change the title of the page, unless you want “Jezza Bear makes a calendar”

Reply | Quote

> You may also want to change the title of the page, unless you want “Jezza Bear makes a calendar”

You’re too nice, Jezza. I wouldn’t have mentioned it until the site had been live for quite a while

Reply | Quote

That is just for starters, Justin may want to check his other pages that I helped himwith

Reply | Quote

I tried this but no luck.

I will sort out the title of the page later.

Reply | Quote

Hi there

This will definitely work. In your CSS place this piece of code:

html 	{
		overflow-x:hidden;
		overflow-y:scroll;
		}

and in the body tag amend it to look like this:

body {
   font : 12px "Lucida Sans Unicode", Verdana, sans-serif;
   color : #333333;
   background: #e9eef4;
   width : 100%;
   padding:0px;
   margin:0px;
   min-width: 600px;
}

Note I have added min-width: 600px; you will have to adjust the value of the pixels to your calendar size.

This will “switch off” your bottom scrollbar on your html page.

Reply | Quote

I tried this and there is still a scroll bar.
I will simply have to live with it.
see attached css.

Reply | Quote

There is no helping you is there. I have just used the css file you have just attached and linked it to the html file you supplied earlier and it works a dream, both in IE and Firefox.

So please review your work, we are not here to do it for you.

Reply | Quote

I am very confused as l have tried the coding and checked it through twice but cannot see where the errors are.
I have made the changes you mentioned.
This is the changes l made to the CSS:

html
{
overflow-x:hidden;
overflow-y:scroll;
}

body {
font : 12px “Lucida Sans Unicode”, Verdana, sans-serif;
color : #333333;
background: #e9eef4;
width : 100%;
padding:0px;
margin:0px;
min-width: 600px;
}

l am sorry but l simply cannot see what is wrong, there is no semi-colons missing. The syntax is correct so l am totattly baffled as to what is wrong. I do apologise but l just cannot see the error having checked the coding several times. Have l overlooked something really obvious?

Reply | Quote

You have an extra } after the body section in your css file. I hope you can see why Jerry is getting frustrated – it’s a very obvious error as the } sits on a line on its own.

Reply | Quote

My aplogise l must have overlooked it.
I have made the change but the problem is still there, any ideas?

Reply | Quote

The only problem with your css was as Waggers explained, the extra }…easy mistake to make when cutting and pasting

Looking at your screenshot, I don’t recognise the browser as the scrollbar looks different to what I am used to.

overflow-x and overflow-y are unsupported by Netscape 6 and 7.

Apart from that I am at a loss and just live with this issue as it will not effect users views too dramatically.

Reply | Quote