HTML - Banner To Fit Any Screen Size ??

Hi all

i have my website all complete but the one thing i would like to do is put an image on the opening page that fills the screen.. no matter what screen resolution someone is on... i have seen this on sites before but cannot remember where it was.

has anyone got any idea how i coul do this?

any help would be much apreciated

Thanks

Hey I made the site princeoflayouts.com, and am having trouble with my last step. The resolution size of the screen. On my laptop the website looks perfect, but then on my schools computers the whole web site is out of whack. I tried to mess with the margins but that didn't help the issue. I used dreamweaer 8 to build the site and have seen the section where it has screen resolution but it only allows me to click it and nothing can be applied or changed.

If you have any advice please tell me. I have a book that helped me through the whole process but this section was not in there.

Thank You

Is there a way to ensure that text size renders well even if screen resolution is extreme?

Thanks...

I am trying to create a table that does not change size depending on what the screen resolution is set to. I know that it is good practice to use percentages, however, as I am used to using pixels, I am finding it frustrating as I don't get the desired table size I want when the resolution is changed

Here is an example of the table, if anyone can help me with the changes, it would be much appreciated or if you could point me in the direction of a tutorial that makes the table resize to reflect the chosen resolution preference, that too would be welcomed

Code:

<font color="#FFFFFF" face="Verdana" size="2">
<table width="810px" align="center" border="0" cellspacing="0" cellpadding="0">
  <tr bgcolor="#000033"> 
    <td height="130px" colspan="2"><div align="center">Header</div></td>
  </tr>
  <tr> 
    <td width="130px" height="130px" bgcolor="#000066"><div align="center">Login</div></td>
    <td width="680px" height="130px" bgcolor="#000099"><div align="center">Image</div></td>
  </tr>
  <tr bgcolor="#0000CC"> 
    <td height="80px" colspan="2"><div align="center">Page Title</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center"></div></td>
    <td rowspan="15" bgcolor="#0066FF"><div align="center">Body</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 1</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 2</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 3</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 4</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 5</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 6</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 7</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 8</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 9</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 10</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 11</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center">Link 12</div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center"></div></td>
  </tr>
  <tr> 
    <td bgcolor="#0033FF"><div align="center"></div></td>
  </tr>
  <tr bgcolor="#003399"> 
    <td height="30px" colspan="2"><div align="center">Footer</div></td>
  </tr>
</table></font>

Thanks in advanced

Hi,

I'm currently designing this website:

www.carmelalopez.com

and I'm trying to get the images on the left to fit the size of the browser screen on the right when you click on them. The images themselves are huge, so I'd like some kind of code that resizes the images to fit the size of the visitor's screen, which will vary from user to user.

This might not be an HTML question (maybe CSS), but any guidance in the right direction would be greatly appreciated.

Thank you.

Hi! I'm new to this site and new to HTML so please don't bash me. I really need help with a problem I have. I have four images as my buttons and links to various pages on my site. They're rectangles that spread out horizontally on my screen. However, not all computer screens are the same size, so at school for example, since the screen is smaller, the order of my links gets messed up. Is there any way to size an image so that it is 25% of a moniter? If so, could someone just like, right the code down so I may copy? I"m really bad at html. Any help would be appreciated. Thanks!

hi guys, I have this code he

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Under construction</title>
</head>

<body style="background-color:#121212">
<div style="background: url(under_construction.jpg) no-repeat center top ;
    height: 1024px;
    margin: auto;">
</div>
</body>
</html>

the image under_construction.jpg is basically the page itself, it has a size of 1680x1024. As of right now the page doesn't adjust automatically to the users screen. Please help me change the code so that it'll adjust automatically to the user screen

I placed all my adsense ads into iFrames but when I resize the window small all the ads are pushed to the middle of the screen. How can I make them stay put.

I tried working with divs too but it makes the ads the highest layer and it makes an invisible border stretching across the screen and I cant click anything thats in that border range.

heres some of my code:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style2.css" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<center>
<head>

<title>BIO</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
</tr>
</table>
<!-- End ImageReady Slices -->

<iframe src="/adsense.htm" width="120px" height="600px" frameborder="0" style="position:relative;Left:1173;bottom:865" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe>

<iframe src="/adsense2.htm" width="120px" height="600px" frameborder="0" style="position:relative;Left:-92;bottom:865" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe>


<iframe src="/adsense3.htm" width="728px" height="90px" frameborder="0" style="position:relative;Left:50;bottom:518" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe>

<iframe src="/adsense4.htm" width="336px" height="280px" frameborder="0" style="position:relative;Left:195;bottom:1560" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe>

</body>
</center>
</html>

i have 2 frames in my parent frame say 1.htm ie left frame and 2.htm ie right frame
now this 1.htm is quite a long frame and has a scrollbar
and 2.htm is a short one
i dont the scroll bar beside my frame 1 but want it to be for my entire parent window
ie i wont to scroll both my left and right frames together
how do i do that

Hi!

I have a page that contains a text area. What I want it to do is to change its size according to the size of the browser window.

How can I make it do that?

I did it once but just can't seem to remember how I did it.

Thanks

All:

Working to update a previously designed website.

Original design uses an <img> tag to create a top banner and another <img> tag
to create a side banner.

In each case there are mapped coordinates on each banner as links for the subsequent pages.

Basic page design is as follows:

Code:

<table>
   <tr>
      <td>
         <img usemap="Map1">
         <map name="Map1">
            <area>
            <area>
            <area>
         </map>
      </td>
   </tr>
</table>
<table>
   <tr>
      <td>
         <img name="Map2">
         <map>
            <area>
            <area>
            <area>
         </map>
      </td>
      <div>
         ***PAGE CONTENT***
      </div>
   <tr>
<table>

The challenge is that the [PAGE CONTENT] varries in length througout the site causing some pages
to be much longer or shorter than others.

This causes some inconsistencey in the relationship between the side banners height and the
page content.

In other words in some cases the banner is exceptionally longer than the page content and the
reader must scroll past significant "dead-space" before being brought to the lowest
mapped links in the side banner; or...

...in some cases the side banner is significantly shorter than the page content causing the
banner image to appear "poorly-fit" to the page design.

I considered altering the 2nd table instance in the above design so that the banner is carried
in a <td> tag that is adjacent to the page content and hopefully to allow the tag carrying the
image to size relative to the <td> tag carring the content....

Code:

<table>
   <tr>
      <td>
         <img usemap="Map1">
         <map name="Map1">
            <area>
            <area>
            <area>
         </map>
      </td>
   </tr>
</table>
<table>
   <tr>
      <td size="100%">
         <img name="Map2">
         <map>
            <area>
            <area>
            <area>
         </map>
      </td>
      <td size="100%" >
         <table>
            ***PAGE CONTENT***
         </table>
      </td>
   <tr>
<table>

The problem I've found with this is that as the content size causes the image to "flex", either
readablilty or image quality or both are effected, AND the mappings become inconsistent as the
image coordinates constantly change.

I've considered 2 solutions and am leaning toward one, but thought I'd post this and see if there
are better ideas I'm overlooking.

One idea was to add additional table rows inside the [PAGE CONTENT] table presumably creating a
"defalut" page size that would never be smaller than a standard for the side banner.
Problem: larger page sizes are still a problem as are the changing map coordinates

My other idea was to return to the original page design listed first above and again settle on
a standard side banner "height"... ...any page that was significantly longer than that height
would be split to 2 or more pages with a [NEXT>>] button at the bottom of the page navigating to
the additional content.
Problem: ...possible complications splitting content...
Benefit: ...consistent page design that allows a consistent side banner with navigable links...


Question for the group:
Does this sound reasonable?
Are there better alternatives I am overlooking?

THANKS IN ADVANCE FOR ALL INPUT!!

Hi everybody I am a new member. I'm not to experienced with css style sheets or html and have a small problem. I have attached code. My website is www.intelligentstudentfinance.com

I want to move the banner at the bottom of the financial aid page to the extreme right but not sure what the code is. I have attached the code in txt format and commented the banner I want want moving to the right.

Look forward to your replies

Thanks

My site is: h1.ripway.com/shsepac
How can I make the banner so there is no space at the top and at the bottom?

I'm trying to set the following banner up on my site but when I paste the code at the end of the page the banner keeps appearing at the top of the page. Can anybody explain why?

<div style="z-index: 110; position: absolute; width: 468px; font-family: arial,sans-serif; background: url(&quot;http://outils.acf-webmaster.net/bann...2482.gif&quot;) repeat scroll 0% 0% transparent; height: 60px; color: rgb(255, 255, 255); font-size: 12px; top: 26px; left: 34px;">
<div style="position: absolute; line-height: 110%; width: 200px; top: 1px; left: 55px;">
<font xmlns="http://www.w3.org/1999/xhtml"><font xmlns="http://www.w3.org/1999/xhtml"> <font size="1px;">
<strong>
<font face="Verdana">
280 different
<a style="color: rgb(255, 255, 2); font-size: 10px;" href="http://www.casinoriva.com/en/" target="_blank">online casino</a>
games await for you.
</font>
</strong>
</font>
</font></font></div>
</div>

Hey, i have a problem with my banner(logo)



I want the banner to be at the top, not underneath it. I want it to be centered and at the top, stuck to the border or something, like at http://habblogg.net, here is my site http://habbxtra.net

Please help anyone