PDA

View Full Version : Making a banner stretch to fit table...


MusicMan
11-21-2005, 08:54 PM
I'm running Vbulletin 3.5.1 and I've got a site logo in the header of each of my pages. The image is 983 wide X 50 high. I've discovered that the banner fits the homepage very well, but doesn't in some other pages. I've tried messing around with coding although I know very little so far. I've tried the "width=100%" and such, with no luck. I might not have phrased it correctly though.

So how would I go about modifying the image or the header template so that it is "liquid" and occupies the full width of the table in all of my pages? Thanks :)

Tony G
11-21-2005, 11:23 PM
Going to need your header code for this.

MusicMan
11-22-2005, 12:44 AM
Going to need your header code for this.

Here is the header code.

<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="$stylevar[left]"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
<td align="$stylevar[right]">
&nbsp;
</td>
</tr>
</table>
<!-- /logo -->

<!-- content table -->
$spacer_open

$_phpinclude_output

MusicMan
11-23-2005, 12:59 AM
Anybody know how to do this?

Chris M
11-23-2005, 01:10 AM
You will need to create a repeating image...

Then add this css:
.fluidheader {
background: #hexcode url('/path.to.repeat/image.ext') repeat-x;
}
Now alter these lines of the header template:
<td align="$stylevar[left]"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
<td align="$stylevar[right]">
&nbsp;
</td>
Replace them with:
<td width="100%" class="fluidheader" style="border: #000000 1px solid;"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
If memory serves (I may have gotten a few bits wrong :p) this should create a 100% width table, with your header image on the absolute left, with the repeating image repeating from the end of the banner to the far right, and the whole lot encased in a 1px thick black border :)

Chris

MusicMan
11-23-2005, 04:37 AM
If memory serves (I may have gotten a few bits wrong :p) this should create a 100% width table, with your header image on the absolute left, with the repeating image repeating from the end of the banner to the far right, and the whole lot encased in a 1px thick black border :)

Chris

Chris, thanks a lot. It worked like a charm :)

CSS59
12-22-2005, 11:10 PM
How do you put one on the left, one at the right and the repeating image filling the middle?

Thanks for the help

MRGTB
09-03-2006, 12:00 PM
were do you add the CSS code, does that go in the big square box in main styles

commonsy
02-15-2012, 03:48 PM
How do you put one on the left, one at the right and the repeating image filling the middle?

Thanks for the help

did you ever fix this man?