The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

Twenty Eleven
I want page/post title links under the search box (see pics) (8 posts)

  1. mluther
    Posted 3 years ago #

    Dear fellow twentyeleven users,

    Currently, my website looks like this: http://i.imgur.com/94tTW.png

    I want it to look like this: http://i.imgur.com/n64wIh.png

    It seems that the area under the search box is a "No text zone". For me, that's a waste of real estate. Because of that waste, My links span 3 rows, when 2 rows would be enough.

    What can I do?


  2. Karun
    Posted 3 years ago #

    May be you should use two menus. One for the top one and another for the bottom one.

  3. mluther
    Posted 3 years ago #


    Is using two menus the best way to solve the problem?

    How do I use two menus?

    What does your "one" (in top one and bottom one) refer to?

  4. Karun
    Posted 3 years ago #

    In the pic what you want your website to look like it shows the search box on the right and then continue with your menu list. This breaks your menu. So you should use two menu. Primary and Secondary menus. Use one menu before the search box and another menu after the search box. This will get your site the way you want.

  5. WPyogi
    Forum Moderator
    Posted 3 years ago #

    mluther, you MIGHT be able to use "float: right;" for the search box -- so that the menu wraps around it. But hard to say without seeing the site live and trying a few things with the CSS using Firebug...

  6. mluther
    Posted 3 years ago #


    Thank you for your input.

    Here's my site's CSS:

    Here's a page's HTML:

  7. mluther
    Posted 3 years ago #

    To WPYogi or anyone else who knows CSS:

    I have a child theme for my twentyeleven theme.

    It currently is pretty much empty:

    Theme Name: Twentyeleven Child
    Version: 12.8
    Template: twentyeleven
    /* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
    -------------------------------------------------------------- */
    @import url("../twentyeleven/style.css");
    /* Sidebar Text Widget Title text becomes red */
    .widget-title {
    	color: #FF0000;

    How do I use the "float: right;" code? What exactly do I write into my child css file? Thanks.

  8. WPyogi
    Forum Moderator
    Posted 3 years ago #

    Sorry, but it's really hard to work with CSS without seeing the site live... Basically, the idea would be to float a div (containing the form/search) to the right -- so that the menu wraps around it -- the same concept that is used to wrap text around an image. You would need to assign an id to the form div, then add CSS:

    #mysearchdiv {
       float: right;

    But you'd also almost certainly need to fuss around with some other CSS for the menu -- really can't tell exactly what without the site live -- sorry. And, like I said, this is only a guess... CSS is always trial and error.

    Other possibility is using absolute positioning -- but again, can't tell for sure without a live site.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic