Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Dec 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    vBulletin & cross-resolution compatibility.

    I'm creating a style for a board that I go to, and after doing a little research I found that 800x600 is the common resolution, but there's quite a few members that use 1024x768 and up. Nonetheless I've started to design it in 800x600, but I want it so that the header will stretch to fit the entire screen, I've basically got an area on the right (pixel stretched) that should expand with the resolution but I'm having problems with it.

    See, I've set the table width (that the header is placed in) to 100%, and in 800x600 it works fine, but anything upwards of that the header gets distorted as the slices space out from each other.

    Can somebody give me any help on this? I can post the HTML if that's needed.

  • #2
    Regular Coder
    Join Date
    Nov 2002
    Location
    Bristol, UK
    Posts
    932
    Thanks
    0
    Thanked 0 Times in 0 Posts
    post the html for the table's header row only, and I'll have a look

    From the sound of it, you have more than one table cell on the header row. I suggest making all except one fixed width, that way you can control which one resizes

    ::] krycek [::
    ithium | SOAPI | SDP | PTPScript manual
    "ithium is a non-profit webhost, which is pretty much unique. The mission of ithium is to provide free hosting resources for worthwhile and needy non-profit projects, which otherwise may not be able to obtain such facilities. The money from commercial customers goes to maintain ithium's servers and further development."

  • #3
    New to the CF scene
    Join Date
    Dec 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    For some reason, now, it doesn't even display in 800x600 correctly... the header04.gif that is supposed to stretch is now stretching the screen, . I may try reslicing it. As for this code, it's the default stuff that Photoshop put out with some tweaks I've made to try and get the image to stretch.

    Thanks for your help.

    Code:
    <TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0>
    	<TR>
    		<TD>
    			<IMG SRC="v4_images/header_01.gif" WIDTH=213 HEIGHT=78 ALT=""></TD>
    		<TD ROWSPAN=2>
    			<IMG SRC="v4_images/header_02.gif" WIDTH=146 HEIGHT=98 ALT=""></TD>
    		<TD COLSPAN=4 ROWSPAN=2>
    			<IMG SRC="v4_images/header_03.gif" WIDTH=201 HEIGHT=98 ALT=""></TD>
    		<TD COLSPAN=5 ROWSPAN=2>
    			<IMG SRC="v4_images/header_04.gif" WIDTH=207 HEIGHT=98 ALT=""></TD>
    		<TD COLSPAN=100% ROWSPAN=3 BACKGROUND="v4_images/header_05.gif">
    			</TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=1 HEIGHT=78 ALT=""></TD>
    	</TR>
    	<TR>
    		<TD ROWSPAN=2>
    			<IMG SRC="v4_images/header_06.gif" WIDTH=213 HEIGHT=60 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=1 HEIGHT=20 ALT=""></TD>
    	</TR>
    	<TR>
    		<TD COLSPAN=2>
    			<IMG SRC="v4_images/header_07.gif" WIDTH=168 HEIGHT=40 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/header_08.gif" WIDTH=59 HEIGHT=40 ALT=""></TD>
    		<TD>
    			<A HREF="usercp.php?s=$session[sessionhash]" TARGET="_top">
    				<IMG SRC="v4_images/usercp.gif" WIDTH=66 HEIGHT=40 BORDER=0 ALT="Here you can view your subscribed threads, work with private messages and edit your profile and preferences"></A></TD>
    		<TD COLSPAN=2>
    			<A HREF="calendar.php?s=$session[sessionhash]" TARGET="_top">
    				<IMG SRC="v4_images/calendar.gif" WIDTH=66 HEIGHT=40 BORDER=0 ALT="View the calendar"></A></TD>
    		<TD>
    			<A HREF="memberlist.php?s=$session[sessionhash]" TARGET="_top">
    				<IMG SRC="v4_images/members.gif" WIDTH=59 HEIGHT=40 BORDER=0 ALT="Find other members"></A></TD>
    		<TD>
    			<A HREF="misc.php?s=$session[sessionhash]&action=faq" TARGET="_top">
    				<IMG SRC="v4_images/help.gif" WIDTH=42 HEIGHT=40 BORDER=0 ALT="Frequently Asked Questions"></A></TD>
    		<TD>
    			<A HREF="search.php?s=$session[sessionhash]" TARGET="_top">
    				<IMG SRC="v4_images/search.gif" WIDTH=54 HEIGHT=40 BORDER=0 ALT="Search"></A></TD>
    		<TD>
    			<A HREF="index.php?s=$session[sessionhash]" TARGET="_top">
    				<IMG SRC="v4_images/home.gif" WIDTH=40 HEIGHT=40 BORDER=0 ALT="Home"></A></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=1 HEIGHT=40 ALT=""></TD>
    	</TR>
    	<TR>
    		<TD COLSPAN=100% BACKGROUND="v4_images/header_bot.gif">
    			</TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=1 HEIGHT=8 ALT=""></TD>
    	</TR>
    	<TR>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=213 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=146 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=22 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=59 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=66 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=54 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=12 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=59 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=42 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=54 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=40 HEIGHT=1 ALT=""></TD>
    		<TD>
    			<IMG SRC="v4_images/spacer.gif" WIDTH=3 HEIGHT=1 ALT=""></TD>
    		<TD></TD>
    	</TR>
    </TABLE>

  • #4
    New to the CF scene
    Join Date
    Dec 2002
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    No help on this?

  • #5
    Regular Coder
    Join Date
    Nov 2002
    Location
    Bristol, UK
    Posts
    932
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Whoops, I must have missed your post sorry about that!

    You have a lot going on there, for a start I am not convinced that all those spacers are necessary.

    Try changing the width of the header04 image to 100%:

    <IMG SRC="v4_images/header_04.gif" WIDTH=100% HEIGHT=98 ALT="">

    I am not sure what kind of image it is, i.e. whether it is one that will change a lot when it stretches, but have you considered putting it as a background image in the table cell, so that it will tile? (if tiling it would be appropriate)

    If you need to keep it as an IMG tag, then setting the width of the image to 100% should make it fill the table cell it is in, and if you don't specify the width of the table cell, it should size automatically.

    Make sure that you check if there are any cells on the rows below that need to size too, because if you don't change them they will stop the header from stretching.

    Fingers crossed, because I have only skimmed your code, not tested it, also it has been a long time since I used tables lol - I use CSS as much as possible now

    ::] krycek [::
    ithium | SOAPI | SDP | PTPScript manual
    "ithium is a non-profit webhost, which is pretty much unique. The mission of ithium is to provide free hosting resources for worthwhile and needy non-profit projects, which otherwise may not be able to obtain such facilities. The money from commercial customers goes to maintain ithium's servers and further development."


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •