HTML Forum

**Gladiator** · 08:36 AM

Hi guys,

First of all, I'm a complete noob to CSS, just taught myself the basics yesterday (?!?) with help from the tutorials on this forum and a few other places.

Now, my problem:
My page:
www.livinglandscapes.uk.com/home

I need the text layer on the right hand side of the page to resize with the static background image in the cell (using <div> tags) behind it, but still allow the text in the front layer to scroll up and down.

To explain this simply, I want different screen sizes to adjust so both the image and the text on the layer in front resize together, without the overhang that there is at the moment with the text layer.

I can do this using frames, but obviously don't want to.

The css style for the background image I have at the moment is:

Quote:

/*Background image in cell*/

.tdback { background-image: url(images/backgroundfade2.jpg);
background-repeat: no-repeat;}

Also, the text sits too close to the vertical scroll bar, so I need a fix (padding?) to give me space between the text and the walls of the cell with the background in it.

Finally, at lower screen sizes, I do not want the scroll bar to come INSIDE the right hand edge of the background image as it does at the moment (try minimising the screen, you'll see what I mean).

I hope this all makes sense, if not, please reply and tell me what needs clarifying.

Here's hoping someone can help, and Thanks in advance,
Carl.

**funkdaddu** · 08-26-2005, 03:37 PM

AFAIK, you can't have the background CSS scale the bg but you can make an underlaying layer with an image set to 100% width:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#layer2 {
	visibility: visible;
	position: absolute;
	top: 30px;
	right: 30px;
	left: 30px
	}

#layer1 {
	visibility: visible;
	position: absolute;
	z-index: 0;
	width: 100%
	}

#layer3 {
	visibility: visible;
	position: absolute;
	z-index: 3;
	width: 100%
	}

--></style>
	</head>

	<body bgcolor="#ffffff">
		<div id="layer2">
			<div id="layer1">
				<img src="http://www.livinglandscapes.uk.com/images/backgroundfade2" alt="" width="100%" border="0">
			</div>
			<div id="layer3">
				sdfasdfasdfkljsadf kljasdf 
				<p>asdf </p>
				<p>asdf </p>
				<p>asdf </p>
				<p>asd</p>
				<p>f as</p>
				<p>df </p>
			</div>
		</div>
		<p></p>
	</body>

</html>

It should scale with the page....

**Gladiator** · 08-27-2005, 04:46 AM

funkdaddu:
Thanks for your reply,

Now, as I said, I'm a complete noob to CSS, so I figured the easiest way to check out the code you provided was to put it into a new page to see how it looked.

All it gave me was a blank page with the text on it.

Any further suggestions greatly appreciated?

**Gladiator** · 08-27-2005, 02:38 PM

Anyone?

**funkdaddu** · 12:41 PM

Ah,... it doesn't work in IE.. lemme see if I can fix it...

**funkdaddu** · 02:09 PM

Getting CSS to work right in IE can be a b*tch... but Here's it is:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

        <head>
                <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
                <title>Untitled Page</title>
                <style type="text/css" media="screen"><!--
#layer2 {
        visibility: visible;
        top: 30px;
        right: 30px;
        left: 30px
        }

#layer1 {
        visibility: visible;
        position: absolute;
        z-index: 0;
        width: 100%
        }

#layer3 {
        visibility: visible;
        position: absolute;
        z-index: 3;
        width: 100%;
        z-index: 1
        }

--></style>
        </head>

        <body bgcolor="#ffffff">
                <div id="layer2">
                        <div id="layer1">
                                <img src="http://www.livinglandscapes.uk.com/images/backgroundfade2" alt="" width="100%" border="0">
                        </div>
                        <div id="layer3">
                                sdfasdfasdfkljsadf kljasdf 
                                <p>asdf </p>
                                <p>asdf </p>
                                <p>asdf </p>
                                <p>asd</p>
                                <p>f as</p>
                                <p>df </p>
                        </div>
                </div>
                <p></p>
        </body>

</html>

But from a design point of view, that complex of an image make sthe text hard to read in your site. I would take the "backgroundfade2.jpg" image and fade it back into the green and just leave it in the top-left:

**funkdaddu** · 08-30-2005, 03:01 PM

Uh, someone ban communitysurfer that link is irrelevant... and suspicious...

**Gladiator** · 01:59 PM

Funkdaddu;
Thanks for that, sorry for the delay, been away on holiday and only just got round to looking at this again.

Now, I pasted that lot into a blank page, and added more text to get the scrolling effect going, but no go - I need the background image to stay still in that area, and the text to scroll, and the whole lot to be re-sizable within different browser windows / resolutions.

Please look at the site as it is at the moment, and hopefully you'll see what I mean:
http://www.livinglandscapes.uk.com/home

In the main window, I have the background image static, and the text all scrolls up and down. However, you can see the right hand scrollbar (1024x768) is some way outside the right hand edge of the background image.

If you then reduce the browser window, the scrollbar for the text moves INSIDE the right hand edge of the background image.

I need these to sit together, the scrollable text on top of the static image, with the scrollbar at the EXACT right hand edge of the background image, then I need the whole lot to resize according to Browser window size / screen resolution.

Hope this is a bit clearer now, and here's hoping for some further help.

Carl.

**Gladiator** · 09-08-2005, 03:31 PM

OK Guys, I've managed to now get the textbox scrolling with the static background image, and also get the whole lot to resize with the browser window resolution etc.

Now, I need to get the BACKGROUND IMAGE to resize as well, so the whole image is showing in the window at all times, no matter what size the browser window is.

Make sense? I hope so.

Link again:
http://www.livinglandscapes.uk.com/home

Thanks guys.

**funkdaddu** · 11:08 PM

Scaling that bg image is a pain, there's no CSS markup that supports scaling a background image, so this is the best I could fudge, scroll bars are funny in IE and it doesn't work in firefox. You might want to just make that background image wide enough for a large resolution and fade off the edges, so on smaller resolutions it goes to the edge and on larger it fades nicely.

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

	<head>
		<base href="http://www.livinglandscapes.uk.com/">
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#nav li {
	font-size: 12px;
	text-transform: uppercase;
	margin-bottom: 10px
	}

#nav li a  {
	color: #4e7737;
	background-image: url("images/l1_down.jpg");
	background-repeat: no-repeat;
	background-position: 0 50%;
	display: block;
	padding: 5px 5px 5px 14px;
	border-style: solid;
	border-width: 2px;
	border-color: #fff #000 #000 #fff
	}


#nav li a:hover  {
	color: #fff;
	background-image: url("images/l1_over.jpg")
	}


#nav ul {
	font-size: 0.9em;
	list-style-type: none;
	margin: 0;
	padding: 0
	}

#nav {
	text-align: center
	}

body  {
	font-family: Verdana, Arial, Helvetica;
	background-color: #d3e8c8
	}


A:link, A:active {
	color: rgb(153,153,51);
	font-weight: bold;
	text-decoration: none
	}

A:visited {
	color: rgb(102,102,51);
	text-decoration: none
	}

A:hover {
	color: rgb(255,255,255);
	text-decoration: none
	}

.info   {
	color: #993;
	font-size: 9pt;
	padding-top: 3px;
	padding-bottom: 1em
	}
#header .topimage  {
	background-color: #fff
	}

#header p {
	margin: 0
	}

#container     {
	visibility: visible;
	margin-left: 10px;
	position: absolute;
	top: 160px;
	right: 15px;
	left: 165px
	}



#main         {
	color: #999947;
	font-size: 10pt;
	text-align: justify;
	margin-right: 15px;
	margin-left: 15px;
	z-index: 1
	}
h3 {
	color: #4d7737;
	font-size: 13pt
	}
#nav  {
	visibility: visible;
	position: absolute;
	top: 150px;
	left: 15px;
	width: 150px;
	height: 100px
	}
#nav {
	visibility: visible;
	position: absolute;
	top: 160px;
	left: 15px;
	width: 150px;
	height: 100px
	}

#mainbg {
	visibility: visible;
	position: absolute;
	z-index: -1;
	width: 100%
	}

--></style>
	</head>

	<body bgcolor="#ffffff" leftmargin="15" marginheight="15" marginwidth="15" topmargin="15">
		<div id="container">
			<div id="mainbg">
				<img src="images/indexbackgroundfade.jpg" alt="" width="100%" border="0"></div>
			<div id="main">
							<h3>Welcome to our Website</h3>
							<p>Living Landscapes was set up in September 2003, with help from the Prince's Trust and the Shepway branch of Business Link.</p>
							<p>We have established an excellent&nbsp; reputation for a high standard of work in a very short space of time, and have made a number of customers very happy with our new garden designs.</p>
							<p>The Company has made the news on a number of occasions, most notably for being warded the Institute of Directors' Young Entrepreneur of the Year Award in the Summer of 2004.</p>
							<p align="center"><a href="images/news1.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/tn-news1.jpg" height="120" width="125" border="2"></a></p>
							<p>More recently, the Company made the final of the Shepway Business of the Year Awards 2005.</p>
							<p>Living Landscapes are part of the Marshalls Register of approved landscape contractors, and we are able to offer a 10 year guarantee on all Marshalls products, along with a 5 year labour gurantee.</p>
							<p>As well as membership of the Marshalls Register, the Company is also a probationary member of <a href="http://www.bali.co.uk/about.html" target="_blank">BALI</a>, which has strict vetting procedures for its members.</p>
						</div>
		</div>
		<div id="nav">
			<ul>
				<li><a href="#">Homepage</a>
				<li><a href="#">Services</a>
				<li><a href="#">Portfolio</a>
				<li><a href="#">Awards</a>
				<li><a href="#">Testimonials</a>
				<li><a href="#">Contact Us</a>
			</ul>
			<p><a href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank"><img style="border: 4px groove #C0C0C0" src="images/marshalls.gif" alt="Click Here to find about more about the Marshalls Register" height="103" width="66" border="0"></a></p>
		</div>
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td align="center" bgcolor="white"><img src="images/living-landscapes-logo.gif" height="101" width="600" border="0" style="margin: 5px 0"></td>
			</tr>
			<tr>
				<td class="info" align="center">Tel: 01303 250685&nbsp;&nbsp;&nbsp;&nbsp; Mobile: 07739 415498&nbsp;&nbsp;&nbsp;&nbsp; Email: info@livinglandscapes.uk.com</td>
			</tr>
		</table>
	</body>

</html>

In the future when IE supports CSS3 (ha! like the year 2050) you could use the attributes:
background-size: 100%;
background-origin: content

**Gladiator** · 11-06-2005, 07:46 AM

funkdaddu -

Just want to say Thanks for your help.

I solved the problem in the end by making the static image a bit larger, so it overlaps the page, but is behind the text etc., on a separate layer.

This gives the illusion of resizing, but in actual fact, it just means that more of the image is visible on a higher res. screen.

Your suggestions pointed me in the right direction, so I just wanted to say "Thanks" for the help.

Please check out the finished site and let me know what you think.
www.livinglandscapes.uk.com
Cheers.

**funkdaddu** · 09:56 AM

You may want to look at that site in FireFox (which is now 10% of the market)... it's all out of whack. A lot of elements are overlapping and the text runs of the page, requiring horizontal scrolling. Does that page render ok in IE?

Also, there should be a HTML skip link for your Flash intro, it takes forever to load. (I always skip those)

**Gladiator** · 11-07-2005, 10:32 AM

Oh Bugger!!

Hadn't even thought of that.

Don't suppose there's anyone in here who could make the code Firefox "friendly"?

**funkdaddu** · 11-07-2005, 12:15 PM

Honestly, your code is all sorts of jumbled, you've got orphaned end tags, improperly closed tags, and you should really use CSS in your header and not inline for most of your divs. Take a look at this, it's formatted better:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#nav li    {
	font-size: 12px;
	line-height: 12px;
	text-transform: uppercase;
	margin: 0 0 5px;
	padding: 0
	}




#nav li a   {
	color: #4e7737;
	background-image: url("images/l1_down.jpg");
	background-repeat: no-repeat;
	background-position: 0 50%;
	display: block;
	margin: 0;
	padding: 5px 5px 5px 15px;
	border-style: solid;
	border-width: 2px;
	border-color: #fff #000 #000 #fff
	}



#nav li a:hover {
	color: #fff;
	background-image: url("images/l1_over.jpg")
	}

#nav ul {
	font-size: 0.9em;
	list-style-type: none;
	margin: 0;
	padding: 0
	}

body {
	font-family: Verdana, Arial, Helvetica;
	background-color: #d3e8c8
	}

A:link, A:active {
	color: rgb(153,153,51);
	font-weight: bold;
	text-decoration: none
	}

A:visited {
	color: rgb(102,102,51);
	text-decoration: none
	}

A:hover {
	color: rgb(255,255,255);
	text-decoration: none
	}

.info {
	color: #993;
	font-size: 9pt;
	padding-top: 3px;
	padding-bottom: 1em
	}

#header .topimage {
	background-color: #fff
	}

#header p {
	margin: 0
	}

#container  {
	visibility: visible;
	position: absolute;
	z-index: 5;
	height: 500px;
	top: 160px;
	right: 10px;
	left: 180px
	}


#main   {
	color: #999947;
	font-size: 10pt;
	background-image: url("images/indexbackgroundfade2.jpg");
	background-attachment: fixed;
	text-align: justify;
	margin: 0;
	padding: 0;
	height: 500px;
	overflow: scroll;
	}



h3 {
	color: #4d7737;
	font-size: 13pt
	}

#nav {
	text-align: center;
	visibility: visible;
	position: absolute;
	top: 160px;
	left: 15px;
	width: 150px;
	height: 100px
	}
#footer  {
	visibility: visible;
	position: absolute;
	width: 100%;
	text-align: center;
	font-size: 10px;
	clear: both
	}


--></style>
	</head>

	<body bgcolor="#ffffff" leftmargin="15" marginheight="15" marginwidth="15" topmargin="15">
		<div id="container">
			<div id="main">
				<p align="center" style="font-size: 13pt;color: #4d7737">Welcome to our Website</p>
				<span style="color: #4d7737;">
					<p align="center">With the value of houses constantly rising and the garden becoming much more of a selling point in today's property market, there has never been a better time to call in the professionals to help you realise your garden's full potential.</p>
					<p align="center">At Living Landscapes, we view your garden as an extension to your home, and with our work we always endeavour to work closely with our customers and their ideas to achieve the effect of adding an extra room to your house.</p>
				</span>
				<p align="center">Living Landscapes was set up in September 2003, with help from the Prince's Trust and the Shepway branch of Business Link.</p>
				<p align="center">We have established an excellent&nbsp; reputation for a high standard of work in a very short space of time, and we have made a number of customers very happy with our new garden designs.</p>
				<p align="center">The Company has made the news on a number of occasions, most notably for being awarded the Institute of Directors' Young Entrepreneur of the Year Award in the Summer of 2004:</p>
				<p align="center"><a href="images/news1.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/tn-news1.jpg" alt="Click for Larger Image" height="150" width="156" border="2"></a>&nbsp; <span style="color: #4d7737;"><a href="images/news2.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/tn-news2.jpg" alt="Click for Larger Image" height="150" width="133" border="2"></a></span></p>
				<p align="center">More recently, the Company made the final of the Shepway Business of the Year Awards 2005:</p>
				<p align="center"><span style="color: #4d7737;"><a href="images/awards/image-award1.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/awards/tn-award1.jpg" longdesc="Click for Larger Image" height="150" width="104" border="2"></a></span></p>
				<p align="center">Living Landscapes are part of the <a title="Click Here to find about more about the Marshalls Register" href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank">Marshalls Register of approved landscape contractors</a>, and we are able to offer a 10 year guarantee on all Marshalls products, along with a 5 year labour guarantee:</p>
				<p align="center"><a href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank"><img style="border: 4px groove #C0C0C0" src="images/marshalls.gif" alt="Click Here to find about more about the Marshalls Register" height="103" width="66" border="0"></a></p>
				<p align="center">As well as membership of the Marshalls Register, the Company is also a probationary member of <a title="Click Here to find out more about BALI" href="http://www.bali.co.uk/about.html" target="_blank">The British Association of Landscape Industries (BALI)</a>, which has strict vetting procedures for its members.</p>
				<p align="center">Please take some time to browse our site, where you can find details of some of our past projects, and you can view a few testimonials from some of our many satisfied customers.</p>
				<p align="center">If you have any questions at all, please don't hesitate to <a href="contact.htm" target="_self">contact us</a><span style="color: #4D7737"> today, and let Living Landscapes &quot;<u><i>Bring Your Garden To Life</i></u>&quot;</span></p>
			</div>
			<div id="footer">
				<p align="center"><img src="images/webtechlogo.gif" height="60" width="120" border="0"></p>
				<p>This Website Copyright &copy; 2005 Webtech Designs (UK) and Living Landscapes.</p>
			</div>
		</div>
		<div id="nav">
			<ul>
				<li><a href="#">Homepage</a>
				<li><a href="#">Services</a>
				<li><a href="#">Portfolio</a>
				<li><a href="#">Awards</a>
				<li><a href="#">Testimonials</a>
				<li><a href="#">Contact Us</a>
			</ul>
			<p><a href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank"><img style="border: 4px groove #C0C0C0" src="images/marshalls.gif" alt="Click Here to find about more about the Marshalls Register" height="103" width="66" border="0"></a></p>
		</div>
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td align="center" bgcolor="white"><img style="margin: 5px 0" src="images/living-landscapes-logo.gif" height="101" width="600" border="0"></td>
			</tr>
			<tr>
				<td class="info" align="center">Tel: 01303 250685&nbsp;&nbsp;&nbsp;&nbsp; Mobile: 07739 415498&nbsp;&nbsp;&nbsp;&nbsp; Email: <a href="mailto:%20info@livinglandscapes.uk.com">info@livinglandscapes.uk.com</a></td>
			</tr>
		</table>
	</body>

</html>

Personally, the scrolling div is not a good way to do it, as some people with different sized screens will have 2 scroll bars.... and it's hard to read the text with that background/text color combination.

**Gladiator** · 02:17 PM

Thanks mate, I appreciate that, it seems to work fine in Firefox as well, I know what you mean about the text, for some reason the font colour's changed in your version from the dark green I have it set at.

Try this, and hopefully you'll see what I mean:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#nav li    {
	font-size: 12px;
	line-height: 12px;
	text-transform: uppercase;
	margin: 0 0 5px;
	padding: 0
	}




#nav li a   {
	color: #4e7737;
	background-image: url("images/l1_down.jpg");
	background-repeat: no-repeat;
	background-position: 0 50%;
	display: block;
	margin: 0;
	padding: 5px 5px 5px 15px;
	border-style: solid;
	border-width: 2px;
	border-color: #fff #000 #000 #fff
	}



#nav li a:hover {
	color: #fff;
	background-image: url("images/l1_over.jpg")
	}

#nav ul {
	font-size: 0.9em;
	list-style-type: none;
	margin: 0;
	padding: 0
	}

body {
	font-family: Verdana, Arial, Helvetica;
	background-color: #d3e8c8
	}

A:link, A:active {
	color: rgb(153,153,51);
	font-weight: bold;
	text-decoration: none
	}

A:visited {
	color: rgb(102,102,51);
	text-decoration: none
	}

A:hover {
	color: rgb(255,255,255);
	text-decoration: none
	}

.info {
	color: #993;
	font-size: 9pt;
	padding-top: 3px;
	padding-bottom: 1em
	}

#header .topimage {
	background-color: #fff
	}

#header p {
	margin: 0
	}

#container  {
	visibility: visible;
	position: absolute;
	z-index: 5;
	height: 500px;
	top: 160px;
	right: 10px;
	left: 180px
	}


#main   {
	color: #999947;
	font-size: 10pt;
	background-image: url("images/indexbackgroundfade2.jpg");
	background-attachment: fixed;
	text-align: justify;
	margin: 0;
	padding: 0;
	height: 500px;
	overflow: scroll;
	}



h3 {
	color: #4d7737;
	font-size: 13pt
	}

#nav {
	text-align: center;
	visibility: visible;
	position: absolute;
	top: 160px;
	left: 15px;
	width: 150px;
	height: 100px
	}
#footer  {
	visibility: visible;
	position: absolute;
	width: 100%;
	text-align: center;
	font-size: 10px;
	clear: both
	}


--></style>
	</head>

	<body bgcolor="#ffffff" leftmargin="15" marginheight="15" marginwidth="15" topmargin="15">
		<div id="container">
			<div id="main">
				<p align="center" style="font-size: 13pt;color: #4d7737">Welcome to our Website</p>
				<span style="color: #4d7737;">
					<p align="center">With the value of houses constantly rising and the garden becoming much more of a selling point in today's property market, there has never been a better time to call in the professionals to help you realise your garden's full potential.</p>
					<p align="center">At Living Landscapes, we view your garden as an extension to your home, and with our work we always endeavour to work closely with our customers and their ideas to achieve the effect of adding an extra room to your house.</p>
				</span>
				<p align="center">Living Landscapes was set up in September 2003, with help from the Prince's Trust and the Shepway branch of Business Link.</p>
				<p align="center">We have established an excellent&nbsp; reputation for a high standard of work in a very short space of time, and we have made a number of customers very happy with our new garden designs.</p>
				<p align="center">The Company has made the news on a number of occasions, most notably for being awarded the Institute of Directors' Young Entrepreneur of the Year Award in the Summer of 2004:</p>
				<p align="center"><a href="images/news1.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/tn-news1.jpg" alt="Click for Larger Image" height="150" width="156" border="2"></a>&nbsp; <span style="color: #4d7737;"><a href="images/news2.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/tn-news2.jpg" alt="Click for Larger Image" height="150" width="133" border="2"></a></span></p>
				<p align="center">More recently, the Company made the final of the Shepway Business of the Year Awards 2005:</p>
				<p align="center"><span style="color: #4d7737;"><a href="images/awards/image-award1.jpg" target="_blank"><img style="border: 1px solid #000000" src="images/awards/tn-award1.jpg" longdesc="Click for Larger Image" height="150" width="104" border="2"></a></span></p>
				<p align="center">Living Landscapes are part of the <a title="Click Here to find about more about the Marshalls Register" href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank">Marshalls Register of approved landscape contractors</a>, and we are able to offer a 10 year guarantee on all Marshalls products, along with a 5 year labour guarantee:</p>
				<p align="center"><a href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank"><img style="border: 4px groove #C0C0C0" src="images/marshalls.gif" alt="Click Here to find about more about the Marshalls Register" height="103" width="66" border="0"></a></p>
				<p align="center">As well as membership of the Marshalls Register, the Company is also a probationary member of <a title="Click Here to find out more about BALI" href="http://www.bali.co.uk/about.html" target="_blank">The British Association of Landscape Industries (BALI)</a>, which has strict vetting procedures for its members.</p>
				<p align="center">Please take some time to browse our site, where you can find details of some of our past projects, and you can view a few testimonials from some of our many satisfied customers.</p>
				<p align="center">If you have any questions at all, please don't hesitate to <a href="contact.htm" target="_self">contact us</a><span style="color: #4D7737"> today, and let Living Landscapes &quot;<u><i>Bring Your Garden To Life</i></u>&quot;</span></p>
			</div>
			<div id="footer">
				<p align="center"><img src="images/webtechlogo.gif" height="60" width="120" border="0"></p>
				<p>This Website Copyright &copy; 2005 Webtech Designs (UK) and Living Landscapes.</p>
			</div>
		</div>
		<div id="nav">
			<ul>
				<li><a href="#">Homepage</a>
				<li><a href="#">Services</a>
				<li><a href="#">Portfolio</a>
				<li><a href="#">Awards</a>
				<li><a href="#">Testimonials</a>
				<li><a href="#">Contact Us</a>
			</ul>
			<p><a href="http://www.marshalls.co.uk/transform/services/find_installer_results_driveway.asp?postcode=ct19 5ay" target="_blank"><img style="border: 4px groove #C0C0C0" src="images/marshalls.gif" alt="Click Here to find about more about the Marshalls Register" height="103" width="66" border="0"></a></p>
		</div>
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td align="center" bgcolor="white"><img style="margin: 5px 0" src="images/living-landscapes-logo.gif" height="101" width="600" border="0"></td>
			</tr>
			<tr>
				<td class="info" align="center">Tel: 01303 250685&nbsp;&nbsp;&nbsp;&nbsp; Mobile: 07739 415498&nbsp;&nbsp;&nbsp;&nbsp; Email: <a href="mailto:%20info@livinglandscapes.uk.com">info@livinglandscapes.uk.com</a></td>
			</tr>
		</table>
	</body>

</html>

Now, how do I get rid of that horzontal scrolling bar at the bottom of the inset window. IE enables you to disable it, there must be a way to do the same in Firefox?

Appreciate your help with this, will make it all worth your while.....

**funkdaddu** · 11-07-2005, 05:02 PM

Sorry, change "overflow: scroll" to "overflow: auto" in the #main description, that should do it...

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!