Adding image in widget header area

Community Forums Forums Design Tips and Tricks Adding image in widget header area

This topic is: not resolved

This topic contains 6 replies, has 3 voices, and was last updated by  Tony @ AlphaBlossom 1 year, 8 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #19953

    Zach
    Participant
    Post count: 6

    Trying to add an image in the header widget area (size 728×90) I found where it says “31.11111%” It seems to be 336 currently.  Tried making that 728px… No luck :(

    Sorry for the amateur question :)

    Thanks!

    #20035

    braddalton
    Participant
    Post count: 10202

    Could you please link to your site thanks.


    #20100

    Zach
    Participant
    Post count: 6
    #20211

    Zach
    Participant
    Post count: 6

    Any thoughts?

    #20232

    Tony @ AlphaBlossom
    Participant
    Post count: 543

    I would remove #header .widget-area from that grouping, and add it on it’s own:


    #header .widget-area {
    width: 728px;
    }

    You can change the width, add any padding, margin etc also. If your site is responsive, you can use % but you’ll have to figure something out as things get smaller.

    Also, you have to adjust #title-area (around line 471). I would do the same, remove it and add it to it’s own line and adjust the width so that they’ll both fit.

    That should do it!


    #20390

    Zach
    Participant
    Post count: 6

    Thanks!  That worked for the most part… But you’re right, as things get smaller on a desktop it begins to look a little funky (until the banner wraps below)  I’ve tried both PX and %, the % seems to work a little better.

    Thanks again,

    Z

     

    #20418

    Tony @ AlphaBlossom
    Participant
    Post count: 543

    Glad it helped. You can use media queries to control the css at various sizes, which will allow you to make sure it looks good on any device.


Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.