FUDforum
Fast Uncompromising Discussions. FUDforum will get your users talking.

Today's Messages (off)  | Unread Messages (on) | Subscribed Forums (off) | Subscribed Topics (off) | Unanswered Messages (off)

Forum: Forum Styles
 Topic: Full Width Header Banner image?
Full Width Header Banner image? [message #187851] Mon, 06 April 2020 16:24
Kermit is currently offline  Kermit   United Kingdom
Messages: 35
Registered: November 2004
Karma:
Member
add to buddy list
ignore all messages by this user
Hi, hoping someone can help me with this relatively minor detail.

I used to be able to edit the header.tmpl to remove the search box (done) and make my forum Honda-Header.png (banner) stretch across the full screens width depending on how wide the readers screen/browser Window is. I always used to kind of fluke it by trail and error then tend to loose the formatting when updating. I'm fairly clueless with html/php/css etc and hope its an easy adjustment that my blindness to coding in general (other than very basic stuff) is responsible for.

My forum is http://honda-forums.com/forum/ and you'll see the banner on typical 1920 wide screen takes up 50% width, I'd like 95% or so.

The line I think it may be is <img class="headimg" src="{THEME_IMAGE_ROOT}/Honda-Header.png" alt="" align="centre" height="50" />

and I think used to use <img class="headimg" src="{THEME_IMAGE_ROOT}/Honda-Header.png" alt="" align="centre" height="50" width=95%/> but that doesn't seem to work now. Maybe its forum.css.tmpl but I have even less idea with css other than the general concept of css so can anyone point me in the right direction with the code change?

<!DOCTYPE html>
<html lang="{LANG}" dir="{DIR}">
<head>
	<meta charset="{CHARSET}">
    	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta name="description" content="{IF: !empty($META_DESCR)}{VAR: META_DESCR}{ELSE}{GVAR: FORUM_DESCR}{END}" />
	<title>{GVAR: FORUM_TITLE}{VAR: TITLE_EXTRA}</title>
	<link rel="search" type="application/opensearchdescription+xml" title="{GVAR: FORUM_TITLE} Search" href="{BASE}open_search.php" />
	{VAR: RSS}
	<link rel="stylesheet" href="{THEME_ROOT}/forum.css" media="screen" title="Default Forum Theme" />
	<link rel="stylesheet" href="{BASE}js/ui/jquery-ui.css" media="screen" />
	<script src="{BASE}js/jquery.js"></script>
	<script async src="{BASE}js/ui/jquery-ui.js"></script>
	<script src="{BASE}js/lib.js"></script>
</head>
<body>
<!-- {INJECTION_POINT: left_block} -->
<div class="header">
  {IF: $GLOBALS['FUD_OPT_1'] & 1 && $GLOBALS['FUD_OPT_1'] & 16777216}
  <!--<div class="headsearch">
    <form id="headsearch" method="get" action="{ROOT}">{DEF: _hs}
      <input type="hidden" name="t" value="search" />
      <br /><label accesskey="f" title="{MSG: search_forum_search}">{MSG: search_forum_search}:<br />
      <input type="search" name="srch" value="" size="20" placeholder="{MSG: search_forum_search}" /></label>
      <input type="image" src="{THEME_IMAGE_ROOT}/search.png" alt="{MSG: search}" name="btn_submit">&nbsp;
    </form>
  </div>-->
  {ENDIF}
  <a href="{BASE}" title="{MSG: home}">
    <img class="headimg" src="{THEME_IMAGE_ROOT}/Honda-Header.png" alt="" align="centre" height="50" />
    <!-- <span class="headtitle">{GVAR: FORUM_TITLE}</span>-->
  </a><br />
  <!--<span class="headdescr">{GVAR: FORUM_DESCR}<br /><br/>   -->

</span>
</div>
<div class="content">

<!-- Table for sidebars. -->
<table width="100%"><tr><td>

[Updated on: Mon, 06 April 2020 16:27]

Report message to a moderator

Re: Full Width Header Banner image? [message #187852 is a reply to message #187851] Mon, 06 April 2020 16:37
Kermit is currently offline  Kermit   United Kingdom
Messages: 35
Registered: November 2004
Karma:
Member
add to buddy list
ignore all messages by this user
btw if someone knows how to turn off the effect where when you hover over an image (banner, image in post etc) where it zooms out slightly, that'd be a two birds with one stone scenario Smile
[more unread messages]



Current Time: Wed Apr 08 07:27:35 EDT 2020

Total time taken to generate the page: 0.00711 seconds