WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] how to get 2 sidebars side by side? (9 posts)

  1. mpm
    Member
    Posted 6 years ago #

    Having a bit of trouble making my custom theme play nice.

    I have 3 columns - content/sidebar/sidebar.

    The 2nd sidebar keeps dropping to the bottom of the 1st sidebar.

    Any solutions or links to sites that could save my bacon?

  2. cemiotika
    Member
    Posted 6 years ago #

    And what's the problem? you want something like

    SIDEBAR CONTENT
    SIDEBAR

    or

    SIDEBAR CONTENT SIDEBAR

    Maybe you must try the float:left, float:right in your style sheet for every container,

    Cheerz!,
    Hope this can Help!,

  3. mpm
    Member
    Posted 6 years ago #

    I want

    CONTENT SIDEBAR SIDEBAR

    BUT I GET

    CONTENT SIDEBAR
    ....................................SIDEBAR

    If I add something to the 1st sidebar (like a widget) that changes the sidebar height the 2nd sidebar drops down with it.

  4. cemiotika
    Member
    Posted 6 years ago #

    You must try something like this:

    <style>
    #wrap{size:760px}
    #content{float:left; width:500px;}
    #side1{float:left; width:130px;}
    #side2{float:left;width:130px;}
    </style>
    
    <?php get_content(); ?>
    <?php get_side1(); ?>
    <?php get_side2(); ?>

    This must work,

    Cheerz!,
    Hope this can Help!,

  5. cemiotika
    Member
    Posted 6 years ago #

    You must try something like this:

    <style>
    #wrap{size:760px}
    #content{float:left; width:500px;}
    #side1{float:left; width:130px;}
    #side2{float:left;width:130px;}
    </style>
    
    <?php get_content(); ?>
    <?php get_side1(); ?>
    <?php get_side2(); ?>

    This must work,

    Cheerz!,
    Hope this can Help!,

  6. cemiotika
    Member
    Posted 6 years ago #

    Check this to make you an idea of what im talking about:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <style>
    #wrap{size:760px}
    #content{float:left; width:500px;}
    #side1{float:left; width:130px;}
    #side2{float:left;width:130px;}
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    </head>
    
    <body>
    <div class="wrap">
      <div id="content">CONTENT</div>
      <div id="side1">SIDEBAR 1</div>
       <div id="side2">SIDEBAR 2</div>
    </div>
    </body>
    </html>

    Cheerz!,
    Hope this can Help!,

  7. nolageek
    Member
    Posted 6 years ago #

    Wouldn't you want this?

    #content{float:left; width:500px;}
    #side1{float:right; width:130px;}
    #side2{float:right;width:130px;}

    (nevermind, you were right. Mine swapped Side1/Side2)

  8. moshu
    Member
    Posted 6 years ago #

    If you have margins/paddings and borders - the 500+130+130 will not fit in 760, and one sidebar will always go down!

  9. mpm
    Member
    Posted 6 years ago #

    Thanks heaps guys. That worked a treat.

Topic Closed

This topic has been closed to new replies.

About this Topic