CSS Float: content AFTER the loop needs to float UP (5 posts)

  1. mores
    Posted 7 years ago #


    is there a way to float a div at the top right corner of a content area, but actually define the div at the end of the content?

  2. Chrisber
    Posted 7 years ago #

    Use relative positioning to move it away from its normal position in the page flow.

  3. mores
    Posted 7 years ago #

    Mind helping me out a bit?
    Here's my code:

    <div id="container">
      <div id="navi">listpages</div>
      <div id="logo">logo</div>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
      <div id="header">header image</div>
      <div id="content">
        <p><?php the_content('more »'); ?></p>
    <?php endwhile; else: ?><p>Nothing found!</p><?php endif; ?>
      <div id="side">Subpage loop</div>
    <?php get_footer(); ?>
    </div> <!-- container -->

    The important CSS parts are

    #container {width:800px; margin:0px auto; padding:10px 0 0 0;}
    #navi{width:650px; height:63px; float:right;}
    #logo {width:150px; height:63px; float:left;}
    #header{width:800px; height:250px; float:left; overflow:hidden; margin: 25px 0 15px 0;}
    #content {width:100%;float:left;}
    #side {float:right; width:266px;}

    I just can't get my head around it.

  4. Chrisber
    Posted 7 years ago #

    What are you trying to move and where do you want it to appear?

  5. mores
    Posted 7 years ago #

    the "side" div.

    On the site
    you see two subpages listed. That's a temporary solution using wp-list-pages.

    What I want is for the subpages to be listed like on this page
    That's the "side" div that's hugging the top right corner.

    Is that understandable?

Topic Closed

This topic has been closed to new replies.

About this Topic