Header image and menu alignment (Spun theme customization)

  • Unknown's avatar
    mcicpublicengagement · Member ·

    Hi there,

    I am modifying the “Spun” theme. First thing I did was adjust the size of the header image as I found it too small. I “hid” the header under the customization menu and used this code to replace it:

    #masthead {
    position: relative;
    top: 0px;
    background: url(‘http://takeactionmanitoba.files.wordpress.com/2015/08/blog-header2.png’) no-repeat;
    width: 1094px;
    height: 225px;
    margin: 0px;
    margin-top: 0px;
    }

    However, now my header image runs into my menu text. I would like the menu text as is, but to be right aligned with the most right circles below the menu (as it is in the original and before I put in my code).

    See here: http://takeactionmanitoba.org/

    Please help! Much thanks.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, the navigation is a child dive within the #masthead div, so you need to set the width of the #masthead div at 100%. The menu will automatically float to the right then.

    There are problems though with this approach. The menu and your header image clash when you narrow down your browser window. Specifically at 1200px in width and narrower. In addition, as you narrow the browser window even further, your header image starts to get cut off on the right side.

    We can move the navigation down below the image and above the circle images as one possible solution, but we still have the issue of your header image getting cut off. I can set it to get smaller as the browser window is narrowed, but that can present spacing issues. All of this is tricky on responsive width themes such as Spun.

    Take a look at things with the above change and let me know what you think on my possible solutions to the issues I mentioned.

  • Unknown's avatar
    mcicpublicengagement · Member ·

    Thanks thesacredpath! That was helpful, however after I made that change I found that there were a number of other tedious changes to this theme that I think are more work than they are worth. I appreciate the help, but I am going to move on to another theme…. Fingers crossed.

  • Unknown's avatar
    thesacredpath · Member ·

    @mcicpublicengagement, I can understand. Spun can be quite s challenge. Let us know if you have questions on your new theme.

  • The topic ‘Header image and menu alignment (Spun theme customization)’ is closed to new replies.