Hi All

 

Please can you have a look at my page here

 

The layout for "home", "services" and "contactus" seems to be ok, but if you're on any of these pages and click on either "about us" or "online booking", the page seems to shift to the right a little.

 

Can anyone suggest why it is doing this and what I should change to make it the same as the home page etc..?

 

The CSS is:

 

body{
background: url(images/backgrounds/background1.jpg);
text-align: center;
font-family:Trebuchet MS;
height:100px;
}
#wrapper {
margin: 0 auto;
text-align:left;	
width: 800px;
background-color:#ffffff;
}
#hometitle{
font-size:60pt;
font-weight: 400;
text-align:left;
color:#46afee;
padding-left:24px;
}
#buttons{
padding-left:30px;
padding-top:10px;
}
#buttons img{
padding-right:15px;
border:0;
}
#homeimage{
text-align:right;
padding-top:20px;
padding-right:24px;
}
#homeimage img{
width:97%;
}
#maintext{
font-style: italic;
font-size:16px;
font-weight:bold;
color:#46afee;
position:absolute;
top:550px;
padding-left:30px;
}
#aboutmain{
color:#46afee;
padding-left:30px;
padding-right:30px;
text-align:justify;
}
#servicesmain{
color:#46afee;
padding-left:30px;
padding-right:30px;
text-align:justify;
}
#servicesmain table{
width:100%;
border-color:#ffffff;
border-collapse:collapse;	
color:#ffffff;
background-color:#46afee;
}
#servicesmain table th{
width:75%;
text-align:left;
}
#contactmain{
color:#46afee;
padding-left:30px;
padding-right:30px;
text-align:justify;
}
#contactmain img{
width:50%;
padding-left:25%;
}
#address{
width:100px;
}
#copyright{
text-align:center;
}

 

Thanks

Kerstey

It's because all the pages have scroll bars down the right hand side except, the booking page

 

Can't remember off-hand how to sort it, but I think it has been discussed previously on the forum

It's because all the pages have scroll bars down the right hand side except, the booking page

 

Can't remember off-hand how to sort it, but I think it has been discussed previously on the forum

Oh I see, so it should sort itself out once I put some content in that page.

If you want the scrollbar to always just add this CSS, I think it'll work anyway?

 

html {
overflow-y: scroll;
}

 

Edit: Just tested and works on mine

If you want the scrollbar to always just add this CSS, I think it'll work anyway?

 

html {
overflow-y: scroll;
}

 

Edit: Just tested and works on mine

Oh thanks, that's done the trick. But it doesn't like it in the CSS validator

Oh thanks, that's done the trick. But it doesn't like it in the CSS validator

 

It's valid CSS3.

It's valid CSS3.

 

Hmmmm..I'm afraid that doesn't help me much

Could try:

 

html {
overflow: scroll;
}

 

But that will provide a horizontal scroll as well to all pages.. but it will be valid css

 

Just thought of another way. You could set a min-height on to the div where text would go?