Need help? Check out our Support site, then


Make twentyeleven title image responsive

  1. Hi,

    I used this guide to replace my site title with a logo. I'm using the twentyeleven theme.

    I would like to make the logo responsive so that it will resize together with the rest of the page. I currently have the following in my twentyeleven custom stylesheet:

    #site-title {
    	text-indent:-9999px;
    }
    #site-title a {
    	background:url('http://www.whereskarlo.com/wp-content/uploads/2012/09/logo.png') no-repeat;
    	size:cover;
    	display:block;
    	height:146px;
    	width:473px;
    }

    I have tried size:cover; and size:contain; but it doesn't work. Any suggestions?

    The blog I need help with is www.whereskarlo.com.

  2. The blog you specified at http://www.whereskarlo.com does not appear to be hosted at WordPress.com.

    This support forum is for blogs hosted at WordPress.com. If your question is about a self-hosted WordPress blog then you'll find help at the WordPress.org forums.

    If you don't understand the difference between WordPress.com and WordPress.org, you may find this information helpful.

    If you forgot to include a link to your blog, you can reply and include it below. It'll help people to answer your question.

    This is an automated message.

  3. First, you probably want "background-size" not "size." Second, the container width and heigh matter. Third, you should also consider media query rules at play here.

    This forum is for WordPress.com blogs, and your WordPress blog is not setup here at WordPress.com. However, it's an interesting question. :)

    Please post at http://wordpress.org/tags/twentyeleven?forum_id=5 and reply back here with the link and I will take a look.

Topic Closed

This topic has been closed to new replies.

About this Topic