This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Wide logo, social icons overlapping when scaling down responsively

  • Creator
    Topic
  • #11968
    otakoudev
    Participant

    I’m discovering this great theme and I’m stuck with a problem.
    I’ve a logo 750px wide, when the screen goes smaller than 980px wide the logo is resized to 703px but the themeblvd-contact-bar goes on top of the end of it. Is there a way to resized the logo to a smaller width for the <980px screen size? 541px will be perfect.
    Thanks

    http://i41.tinypic.com/2lt3sk8.png

Viewing 2 replies - 1 through 2 (of 2 total)
  • Author
    Replies
  • #11983
    Jason Bobich
    Keymaster

    Hello,

    The theme is designed for a smaller logo there, but what you’re asking could be possible with of some CSS tweaks I think. An easy way to target the different viewport sizes is to wrap your CSS snippet in a @media query. So, for example, you could style the width of the logo to have a certain width only when the viewport is below 980px:

    @media (max-width: 979px) {
    	.tb-image-logo img {
    		max-width: 541px;
    	}
    }

    ========

    For CSS changes, it’s a good idea to use a tool like firebug or Google Chrome’s built-in developer tools to locate them and then put the edits either in your child theme or in the “Custom CSS” option on your theme options page.

    Also, here’s a helpful tutorial on how to use Firebug – http://vimeo.com/20917974. The only thing I’d suggest not doing is actually making edits to the theme’s CSS files, as it shows at the end of that video. However, the video serves as a good introduction to Firebug and how it can be used to find what CSS is effecting certain areas of your site without ever digging around in any files.

    #11984
    otakoudev
    Participant

    Working perfect. Thanks!!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The forum ‘Alyeska Responsive WordPress Theme’ is closed to new topics and replies.