0

I have been searching the internet and have had no luck.

I am trying to make a website with drupal and and am creating my own theme. I am trying to make the Logo image fill the whole of the header div.

I have found the php code where it writes this code, but if I make the image 100%, then the image goes to its full size, not 100% of the div. I know with html I just add style="width: 100%;" to the end, but it is not working.

This is the code I currently have:

main php file 

<?php if ($logo): ?>
  <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
    <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" style= "width: 100%;"/>
            </a>
        <?php endif; ?>

Please note that I am a beginner to php and only vaguely know how to get around.

Zach Saucier
  • 24,871
  • 12
  • 85
  • 147
Mitchell
  • 11
  • 1
  • 6

1 Answers1

0

Enclose the entire code inside a div like this

<div class="header" height="100px">
<?php if ($logo): ?>
  <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
    <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" style= "width: 100%;"/>
            </a>
        <?php endif; ?>
</div>

You can change the height as per your requirement. Hope this helps you !

sush
  • 379
  • 1
  • 3
  • 11
  • – sush Dec 19 '13 at 04:46
  • all you have done is used an exact size to make that work on your screen. the div i am placing it into is 80% of width of the page – Mitchell Dec 19 '13 at 05:02
  • Ok i understand. I think this might help you [click here](http://stackoverflow.com/questions/3463664/make-an-image-width-100-of-parent-div-but-not-bigger-than-its-own-width) – sush Dec 19 '13 at 05:25
  • that has sort of worked. I changed the styles to: style= "width:100%; position:absolute;top:0;left:0;bottom:0; right:0; but now it is stuck in an absolute position which means that i have to resize my div to be the right size otherwise my menu and body goes over it – Mitchell Dec 19 '13 at 05:59
  • Cheers ! But there is a lot of space below the logo – sush Dec 19 '13 at 06:01
  • You don't have to resize you can try Applying padding-top to the menu div – sush Dec 19 '13 at 06:04
  • to make the menu and other things to align properly change the css of #main{margin-top:-180px;} – sush Dec 19 '13 at 06:36