 |  |  |  |  |  |  |  |
background image - help
Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
 |
hello,
I have placed a backgroung image for the left menu of my store, and when some of the pages of my site become too long, spaces apear between the background image and the rest of the site. I've tried using height="100%" but no luck ( i want to keep the with fixed).
Go here, and you will see what I am talking about
http://www.chicago-bm.com/cgi-bin/ca...2&cat=&catstr=
And here is the layout (site was made using photoshop, imageready, and frontpage 03.
<html>
<head>
<title>002</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (002.psd) -->
<table id="Table_01" width="785" height="894" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2">
<map name="FPMap0">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="601, 93, 641, 109">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=search%22" shape="rect" coords="655, 95, 709, 109">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="58, 16, 212, 103">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="0, 127, 80, 165">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=store%22" shape="rect" coords="78, 127, 171, 166">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=contact%22" shape="rect" coords="169, 126, 258, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=cart%22" shape="rect" coords="256, 126, 352, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=services%22" shape="rect" coords="351, 127, 440, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=checkout%22" shape="rect" coords="439, 126, 537, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=search%22" shape="rect" coords="0, 172, 188, 206">
</map>
<img src="http://chicago-bm.com/images/chicago-bm-template6_01.jpg" width="780" height="208" alt="" usemap="#FPMap0"></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="208" alt=""></td>
</tr>
<tr>
<td width="189">
<img src="http://chicago-bm.com/images/chicago-bm-template2_02.jpg" width="188" height="173" alt=""></td>
<td rowspan="3" width="595">
<!-- ############################################# -->
<!-- # Page Title Insertion # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_pgtitle")
<!-- ############################################# -->
<!-- # Message Insertion # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_message")
<!-- ############################################# -->
<!-- # Content Section # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_element" PARAMS="(CGIVAR)element_id(/CGIVAR)")
</td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="173" alt=""></td>
</tr>
<tr>
<td height=100% background="http://chicago-bm.com/images/002_37a.JPG" width="189">
<!-- ############################################# -->
<!-- # Category Insert Display # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_cat_list")
</td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="368" alt=""></td>
</tr>
<tr>
<td rowspan="2" width="189">
<img src="http://chicago-bm.com/images/chicago-bm-template2_05.jpg" width="189" height="145" alt=""></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="68" alt=""></td>
</tr>
<tr>
<td width="595">
<map name="FPMap1">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="19, 22, 61, 38">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=store%22" shape="rect" coords="84, 23, 141, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=contact%22" shape="rect" coords="160, 22, 214, 40">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=cart%22" shape="rect" coords="230, 23, 290, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=services%22" shape="rect" coords="306, 23, 363, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=checkout%22" shape="rect" coords="382, 22, 443, 38">
<area coords="461, 22, 543, 39" shape="rect" href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=storepolicies%22">
</map>
<img src="http://chicago-bm.com/images/chicago-bm-template2_06.jpg" width="592" height="77" alt="" usemap="#FPMap1" border="0"></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="77" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
I have placed a backgroung image for the left menu of my store, and when some of the pages of my site become too long, spaces apear between the background image and the rest of the site. I've tried using height="100%" but no luck ( i want to keep the with fixed).
Go here, and you will see what I am talking about
http://www.chicago-bm.com/cgi-bin/ca...2&cat=&catstr=
And here is the layout (site was made using photoshop, imageready, and frontpage 03.
<html>
<head>
<title>002</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (002.psd) -->
<table id="Table_01" width="785" height="894" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2">
<map name="FPMap0">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="601, 93, 641, 109">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=search%22" shape="rect" coords="655, 95, 709, 109">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="58, 16, 212, 103">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="0, 127, 80, 165">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=store%22" shape="rect" coords="78, 127, 171, 166">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=contact%22" shape="rect" coords="169, 126, 258, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=cart%22" shape="rect" coords="256, 126, 352, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=services%22" shape="rect" coords="351, 127, 440, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=checkout%22" shape="rect" coords="439, 126, 537, 164">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=search%22" shape="rect" coords="0, 172, 188, 206">
</map>
<img src="http://chicago-bm.com/images/chicago-bm-template6_01.jpg" width="780" height="208" alt="" usemap="#FPMap0"></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="208" alt=""></td>
</tr>
<tr>
<td width="189">
<img src="http://chicago-bm.com/images/chicago-bm-template2_02.jpg" width="188" height="173" alt=""></td>
<td rowspan="3" width="595">
<!-- ############################################# -->
<!-- # Page Title Insertion # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_pgtitle")
<!-- ############################################# -->
<!-- # Message Insertion # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_message")
<!-- ############################################# -->
<!-- # Content Section # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_exec_element" PARAMS="(CGIVAR)element_id(/CGIVAR)")
</td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="173" alt=""></td>
</tr>
<tr>
<td height=100% background="http://chicago-bm.com/images/002_37a.JPG" width="189">
<!-- ############################################# -->
<!-- # Category Insert Display # -->
<!-- ############################################# -->
(CGIGET TYPE="SUB" VALUE="ste_cat_list")
</td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="368" alt=""></td>
</tr>
<tr>
<td rowspan="2" width="189">
<img src="http://chicago-bm.com/images/chicago-bm-template2_05.jpg" width="189" height="145" alt=""></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="68" alt=""></td>
</tr>
<tr>
<td width="595">
<map name="FPMap1">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=splash%22" shape="rect" coords="19, 22, 61, 38">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=store%22" shape="rect" coords="84, 23, 141, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=contact%22" shape="rect" coords="160, 22, 214, 40">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=cart%22" shape="rect" coords="230, 23, 290, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=services%22" shape="rect" coords="306, 23, 363, 39">
<area href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=checkout%22" shape="rect" coords="382, 22, 443, 38">
<area coords="461, 22, 543, 39" shape="rect" href="A%20HREF=%22(CGIVAR)common_url(/CGIVAR)&pg=storepolicies%22">
</map>
<img src="http://chicago-bm.com/images/chicago-bm-template2_06.jpg" width="592" height="77" alt="" usemap="#FPMap1" border="0"></td>
<td width="1">
<img src="http://chicago-bm.com/images/spacer.gif" width="1" height="77" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
•
•
Join Date: Jan 2005
Posts: 294
Reputation: 
Solved Threads: 6
Posting Whiz in Training
After 'carefully' go though your page, I found that it wasn't the problem with your image (your image is NOT a background image, you simply use img script). It was the stucture of your page. Sorry to say that the script was a mess. You need to structure it into table of two column, one for the side menu and the other for the main body. In the script you displaying the image at the side menu then jump into the main body to display your products and at the end jump back to the side menu with all the links (that's why your link push down to bottom of the page. You should structure it so that you display all the side menu (both image and links) before go into the main body. Use WYSIWYG software like frontpage or dreamweaver to deal with.
All the best!
All the best!
Ecommerce-Web-Store.com Building Your e-Business.
|
Similar Threads
- Making a Background Image a Link (HTML and CSS)
- Random Background image (HTML and CSS)
- background image alignment (HTML and CSS)
- Dreamweaver background image refresh (Graphics and Multimedia)
- problem with background image repeat-y (HTML and CSS)
- Background image flickers in IE.... (JavaScript / DHTML / AJAX)
Other Threads in the HTML and CSS Forum
- Previous Thread: Dreamweaver
- Next Thread: error in Mac/IE 5.2 - this.element.style is not an object
| Thread Tools | Search this Thread |
You need to join our community in order to build your list of favorite forums. You can visit the forum index for a listing of all forums.
Related Forum Features
Latest HTML and CSS Posts
- Today's Posts
- Unanswered Threads
appointments asp background backgroundcolor beta browser bug calendar cart cgi code codeinjection corporateidentity css design development displayimageinsteadofflash dreamweaver emailmarketing epilepsy explorer firefox flash form format google griefers hackers hitcounter hover html ie7 ie8 iframe image images internet internetexplorer intranet iphone javascript jpeg layout macbook maps marketshare microsoft mozilla multimedia navigationbars news offshoreoutsourcingcompany opacity opera optimization pnginie6 positioning problem scroll seo shopping swf swf. textcolor timecolor titletags url urlseparatedwords visualization web webdevelopment webform website windows7
