0

Hi, I'm new here, hope someone can help. With frustration I've tried to figure this out. Creating a web page with a fixed width (pixel) is easy. My problem lies with creating one that is set at 100% How do I create and make the banner go from left to right 100% of the top of the page?

with thanks, msmitch

2
Contributors
5
Replies
6
Views
11 Years
Discussion Span
Last Post by tgreer
0

Setting a page to 100% is easy. Designing a banner that does so is different. Essentially, you have to divide your image into 3 pieces, a left and right, and a center pieces that is a simple sliver of solid color. That is the piece that will "expand" to fit the size of the page.

Post in the HTML/JavaScript/CSS section if you need more detailed help.

0

Yes I've tried creating the banner in threes, but testing it on smaller monitors part of the banner appears below. Looks terrible. Anyway to stop this from happening?

0

I think I've got it! Fingers crossed that is. I size the window and the banner remained intact! This is what I put together. I hope I posted this right.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
    margin-top: 0px;
    margin-left: 0px;
}
.style1 {
    font-size: 12px;
    font-weight: bold;
}
-->
</style></head>

<body>
<table width="100%"  border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="30%" align="left" valign="top" bgcolor="#BA9FBE"><img src="images/images/images/chris-banner_01.jpg" width="213" height="104"></td>
    <td width="41%" align="left" valign="top" bgcolor="#BA9FBE"><img src="images/images/images/chris-banner_02.jpg" width="345" height="104"></td>
    <td width="29%" align="center" valign="top" bgcolor="#BA9FBE"><img src="images/images/images/chris-banner_04.jpg" width="105" height="104"></td>
  </tr>
  <tr bgcolor="#000000">
    <td colspan="3"><div align="center"><img src="images/images/spacer.gif" width="2" height="2"></div></td>
  </tr>
  <tr bgcolor="#FFFFFF">
    <td colspan="3"><div align="right" class="style1">Navagation Here </div></td>
  </tr>
</table>
<br>
</body>
</html>
0

If it works, it works! I'm out of the habit of using tables for layout, so didn't immediately think of placing the image elements inside of a table.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.