Grow your CSS skills. Land your dream job.

Various Design Issues

  • # March 12, 2013 at 4:25 pm

    I am having several problems. Here is my website. Okay, so I am trying to create something like this.

    First off, several things that have been ordered to float: right; are not actually floating right. The part that states the author and date, post-info right, and the stated category, category-menu, are not on the right side of the page. But category-menu looks like it might be floating right, I may just need to change the positioning. But post-info right is most certainly not doing what I want it to.

    That is the first issue. Let us figure out that first before I go any further. Thank you in advance!

    # March 12, 2013 at 4:33 pm

    Seem to be floated right to me (or positioned absolutely as it seems). You probably want to use `text-align: right;` to align text. Float moves just the element, it doesn’t touch text inside the element.

    **Edit!**

    Take `position: absolute;` away on some of the floated elements. Elements that are absolutely positioned cannot be floated.

    # March 12, 2013 at 5:46 pm

    @Merri: Yay! I’m an idiot. Yep, text-align indeed did what I was trying to do with float. Sigh. Thank you. Also, I removed position: absolute; on .category-menu and then I gave it padding-left: 300px;, but if you know of a better way to position it, I am up for suggestions.

    Okay, problem #2. When you view a page using single.php like this one, all of the content gets thrown to the left side. The code is pretty much the same on every page, so I opened up single.php, and this is all it is:

    < ?php
    /**
    * The Template for displaying all single posts
    *
    * Please see /external/starkers-utilities.php for info on Starkers_Utilities::get_template_parts()
    *
    * @package WordPress
    * @subpackage Starkers
    * @since Starkers 4.0
    */
    ?>
    < ?php Starkers_Utilities::get_template_parts( array( 'parts/shared/html-header', 'parts/shared/header' ) ); ?>

    < ?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

    < ?php the_post_thumbnail( 'full' ); ?>

    < ?php the_title(); ?>

    # March 12, 2013 at 6:39 pm

    Your `.single {}` class is floated left and has width of 430px.

    Line 458 in your `style.css`.

    # March 12, 2013 at 6:52 pm

    Oh, I see. Oops. I named one of my post types “single” as well. I knew it became broken when I hauled over the new code, I just did not know where I went wrong. Thank you, @AlenAbdula. Life-saver.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".