Simple Machines Community Forum

(https://lh4.googleusercontent.com/-uu29gzOFQtE/Ts58bds0cwI/AAAAAAAAAnA/4T2FQhY-Mz4/s500/banner_resize_question.jpg)

As you can see the banner is a bit short on both sides.  Due to the nature of the image I can't use repeating elements to make the banner expand and shrink with the main body of the forum.  However I need to find a way to make it stay full width with the forum if at all possible whether someone is using a tablet or a large desktop screen.  I have included a snippet of the code from the index.template.php file that appears to control the banner size but I could be wrong.

Any help would be greatly appreciated!

Eric


function template_body_above()
{
   global $context, $settings, $options, $scripturl, $txt, $modSettings, $user_info;

   echo '
   <div id="wrapper"', !empty($settings['forum_width']) ? ' style="width: ' . $settings['forum_width'] . '"' : '', '>
   <div id="headerlink" , <a href="http://blahblahblah.com"></a></div>
      <div id="header"', !empty($settings['header_logo_url_html_safe']) ? ' style="background-image: url(' . $settings['header_logo_url_html_safe'] . ')"' : '', '>
         <h1>', $context['forum_name'], '</h1>';

Set width to 100%.  You'll need a high resolution image to prevent degradation at higher screen res.

Sorry to be such a noob but where exactly do I put the 100%?  Can you show me please?  In the code above or in the CSS that controls the header?

Eric

Try this -



<div id="header"', !empty($settings['header_logo_url_html_safe']) ? ' style="background-image: url(' . $settings['header_logo_url_html_safe'] . '); width: 100%;"' : '', '>