Page 1 of 1
HTML question....
Posted: Sun Jul 17, 2005 8:38 pm
by Bdw3
Say I'm doing a nav bar with just gif images.
I want the last section to be a space filler that stretches to the edge of the page regardless of the viewers screen resolution.
Example:
[200 pixel blank section of bar][100 pixel button][100 pixel button][100 pixel button][How do I make this one stretch to fill the rest of this line]
:icon6:
Posted: Sun Jul 17, 2005 8:42 pm
by bitWISE
Set the width of the parent object and the last child to 100%?
Posted: Sun Jul 17, 2005 8:50 pm
by Bdw3
Parent, Child? o_0
--1 to 10 on HTML knowledge I'm a 4. 
Setting the width of anything to 100% jumps it to the next line.
Posted: Sun Jul 17, 2005 8:52 pm
by bitWISE
Well you need to tell us what exactly you are doing. "HTML" is extremely vague.
If you were using a table:
parent would be the table itself
child would be each cell within the table
Posted: Sun Jul 17, 2005 9:09 pm
by Bdw3
Just plain ole' HTML. 
What I want to do:
http://img270.imageshack.us/img270/7898/bleh4ug.png
I don't want to give it a specific length, I want it to stretch to the edge regardless of res.
Current HTML for the bar you see:
<table height="30" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr valign="top">
<td width="100%">
<img src="images/header.gif"
height="30" width="200" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/header.gif"
height="30" width="300" />
</td>
</tr>
</table>
header.gif being the blank parts, and button.bmp being the button parts. I'm just trying to get it figured out before I do the buttons.
Posted: Sun Jul 17, 2005 9:24 pm
by mjrpes
nice to see you are using xhtml
you will need to set the icon image as a 'background' of a table cell. make an image with just the background part of the button, not the text. this can be short in the horizontal direction, since it will repeat. then you set table to be 100% width, and you give the table cell with the menu to be an exact pixel length. you don't give the expanding cell any specific length (it defaults to fill in the remaining length of the table).
Code: Select all
<table height="30" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr valign="top">
<td width=640>
<img src="images/header.gif"
height="30" width="200" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" /><img src="images/button.bmp"
height="30" width="110" />
</td>
<td style="background-image: url(images/button_bk.gif); background-repeat: repeat-x">
</td>
</tr>
</table>
not sure exactly the code... it should be something like that though.
Posted: Sun Jul 17, 2005 9:29 pm
by bitWISE
Posted: Sun Jul 17, 2005 9:31 pm
by mjrpes
damn straight
Posted: Sun Jul 17, 2005 10:01 pm
by Bdw3
hahah, I see.
Awesome! Thanks guys!. :icon14:
Posted: Sun Jul 17, 2005 10:39 pm
by bitWISE
Bdw3 wrote:hahah, I see.
Awesome! Thanks guys!. :icon14:
n/p. It's never too early to get in the habbit of conserving bandwidth and an empty spacer gif is an easy hack when the browser wont listen to your sizing requests.
Posted: Mon Jul 18, 2005 7:02 am
by MKJ
could also made the table width 100% and insert every button in a different td. give all tds a width cept for the last and itll stretch
ofcourse thats the ugly way to do it
