CSS Positioning Woes. (2 posts)

  1. Matt Hancock
    Posted 7 years ago #

    I'm nearly done porting a layout into WordPress, but I'm stuck with a couple of CSS issues.

    The original, static version can be viewed here and the dynamic version can be viewed here.

    The 2 problems as are follows:

    • The bottom right corner doesn't go right to the side of the page like it does on the static version. I think I crossed a wire when I did the porting to WordPress but I can't see where I went wrong.
    • The content block is absolutely buggered. Since I'm planning on using WP as a CMS (via Ryans Simple CMS), the ability to edit the image and the text is imperative.

    I've been wracking my head around these problems and have drawn a blank. Perhaps some input from the WP community would help. :)

    The static version has the CSS embedded in the HTML. I'll post the code for index.php below:

    <?php get_header(); ?>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    	<div id="content-container">
    			<h1><?php the_title(); ?></h1>
    		<div id="content-top"></div>
    		<div id="main-content">
    		<div class="content-text">
    			<?php the_content(); ?>
    			<?php endwhile; ?>
    			<?php else : ?>
    			<h1>Not Found</h1>
    			<p>Sorry, but you are looking for something that isn't here.</p>
    			<?php endif; ?>
    	  </div><!--end content-text-->
    		</div><!--end main-content-->
    		<div id="content-bottom"></div>
      </div><!--end content-container-->
    <div id="btnrightcnr"></div>
    </div><!--end wrapper-->
    <?php get_footer(); ?>

    Thanks. :)

  2. stvwlf
    Posted 7 years ago #


    Your problem with the photo is this code

    .content-text {style.css (line 144)

    hich is adding a 260px left margin to the photo.

    You have floated the sidebar right, correctly. You are best off floating everything in the content box left, starting with content-container. Then you don't need to worry about left margins etc. Instead of clearing floats you float the next element in line left.

Topic Closed

This topic has been closed to new replies.

About this Topic