Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

How repeat a 1 pixel image across a web page?

Posted on 2004-08-13
5
260 Views
Last Modified: 2013-12-24
This may be a little difficult to explain but here goes...

I have a company logo which is in the left hand side of a banner frame.  Next to that image file, I have a 1 pixel wide x 80 pixel tall jpg image.  This 1 pixel image needs to repeat itself so it fills the width of any user's display no matter what resolution their monitor is set at.

How can I do this?

--Steve
0
Comment
Question by:SteveL13
  • 2
  • 2
5 Comments
 
LVL 3

Expert Comment

by:kay2g
ID: 11796265
why don't you just create a table with 100% width, create a row and a cell, make that 100%, and make that the background. For example:

<table width="100%">
 <tr>
  <td background="yourcompanylogo.gif" width = "100%">&nbsp;</td>
 </tr>
</table>

Hope this helps
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 11796281
I would recommend against using tables for this, much easier to handle with CSS.
If you post a link to your page or code, I can give you an example...

Thanks,
Sean
0
 

Author Comment

by:SteveL13
ID: 11796692
To both who have replied so far:

Here is the code.  So far, the problem is that the logo file appears just fine, but then the "repeating" jpg is appearing on the next line.  All of it has to be on the same line.

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>

<body>

<p><img border="0" src="logofile.jpg" width="800" height="80"></p>

<table width="100%" height="80">
 <tr>
  <td background="bannerrepeat.jpg" width = "100%" height="79">&nbsp;</td>
 </tr>
</table>


</body>

</html>
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 11797062
Well, assuming the logo completely covers the banner, I would handle it like this:

<html>
<head>
<style type="text/css">

#banner
{
    background: url (bannerrepeat.jpg) repeat-x;
}

</style>
</head>

<body>
<div id="banner"><img border="0" src="logofile.jpg" width="800" height="80"></div>
0
 
LVL 3

Accepted Solution

by:
kay2g earned 125 total points
ID: 11810075
you could try this:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>

<body>
<table width="100%" height="80">
 <tr>
  <td> <img border="0" src="logofile.jpg" width="80" height="80"> </td>
  <td background="bannerrepeat.jpg" width = "100%" height="79">&nbsp;</td>
 </tr>
</table>

</body>
</html>
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Now that Expression Web 4.0 (http://www.microsoft.com/expression/products/Upgrade.aspx) is free if you buy or have the full version of Expression Web 3.0, now is the best time to  migrate from FrontPage to Expression Web (http://www.frontpage-to-exp…
This guide will walk you through the essential considerations and tech stack for building scalable websites. Know how to grow your business the smart way!
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
The purpose of this video is to demonstrate how to Test the speed of a WordPress Website. Site Speed is an important metric of a site’s health. Slow site speed can result in viewers leaving your site quickly and not seeing your content. This…

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question