Tom's Guide | Tom's Hardware | Tom's Games
 |
 |
 |
I'm working on a website for someone. After initial talks, they would like to incorporate part of their logo, an arrow. They would like to use the whole screen, and this would work as they have very little information to puton each page. This would obviously mean using tables to scale everything to fir the resolution.
The thing is at the bottom third of the screen they want their arrow. Imagine the arrow starting from a third of the way down the screen on the far left side, then coming across tho the right in a curve, a sort of "u" shape. Is there a way to scale this as the resolution changes and is there a way of setting a graphic to be a sort of footer so it is right at the bottom of the screen all the time?
Cheers.
you could try using nested tables to create the vertical and horizontal parts of your arrow by setting the background colors... and add a "curve" image and an "arrowhead" image in the appropriate places.
I suppose it depends on your logo image as to whether or not this'll work for you.
SullyD
Experience is what you get when you don't get what you want...
0 
Making the image a "footer" is pretty easy.Just create your entire page within a table with a height of 100% and have a single cell that spans the entire width of the table at the botton and put the logo in there.
You can make the logo fill the width of the cell by using width=100%, but that would skew the logo in almost every instance. There is no easy way to make the logo fit the width and stay in proportion. The only way I can think of doing it ould be to use javascript to determine the size of the window and dynamically set the height and width of the logo. I'd suspect that you might run into problems on varing browsers though.
Michael J
0
and to set a backgorund graphic to be at the bottom of the screen all the time you can use css:
put between the <head> tags (or a file):
<style type="text/css">
<!--
body {
background-attachment: scroll;
background-image: url(images/logo.gif);
background-repeat: no-repeat;
background-position: 50% 100%;
}
-->
</style>url is the location of the image, can be absolute or relative (in this case it's relative)... bg position 50% 100% means 50% horizontal and 100% vertical or 'centered bottom', bg attachment 'scroll' means it'll be at the bottom of the page, not the monitor... to make it fixed on the monitor, use 'fixed' instead.
0
michael j posted when I was writing :P
the method of using stretched height table is also possible... to create a w3c comliant table height you need to use css:
<table style="height: 100%">
and as far as I know this wont work on a nested table... and to not interfere with other part, the stretched table must be directly under <body>
<body>
<table style="height: 100%">
<tr>
<td>insert site content here</td>
</tr>
<tr>
<td style="height: 20px;">footer here</td>
</tr>
</table>
</body>---
and about filling a width (or height) with image, as michael said, stretching the image will cripple it... so it depends on the image itself:
- you can repeat the image (with css)
- you can show only part of the image for smaller browser, by setting the image as a table background (also with css).
0
Thanks for all that guys. I have tried to insert a cell in a table which is 100% wide and high but how can you position it to the absolute bottom of the main table? As it stays in the middle.
I know this may not be possible but it would be great to make the background that I want at a lrage size, so it would fit into a high resolution such as 1280x1024. Then have it scale down to fit any lower resolutions like 1024x760 and 800x600. But the table and its content scales down the fit the resolution (100% table) but is there any way to do this with a background?
0
/quote
I have tried to insert a cell in a table which is 100% wide and high but how can you position it to the absolute bottom of the main table? As it stays in the middle.
/quotein the cell, align it to bottom:
<td valign="bottom">content here</td>
/quote
it would be great to make the background that I want at a lrage size
/quotewe cannot set a background image's size... so you might want to try to use big picture as the bacground, align it to top-left (0% 0%) and try to put the important part of the image in the first 800x600 pixels... so when viewed on 1024, the large image shows, but when viewed on 800x600, only part of it shows.., the rest of the image which is bigger than the table will be hidden...
here's what I mean: http://www.donggala.go.id
first, open it with 1024x768 resolution and slowly reduce the browser's width (watch at the header, the top-right one)...
---
you can set a relative "background image" size, just use layers... but when an image is resized by using html, it'll be crippled.
0  |
 |
 |
This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |
