Grow your CSS skills. Land your dream job.

Strange wordpress problem – ‘read more’-posts.

  • # August 4, 2008 at 1:18 pm

    This is my first time making a wordpress-theme and of course i knew it wouldn’t be a walk in the park ;)
    Well well, the strange problem occurs when I write a post which has a lot of text after the "read more" link.
    Well you can see the problem live here: http://www.stadskarnan.com/blog

    As you can see, the footer gets right at the top of the content area, the border of the content area dosen’t continue til the bottom of the page and the sidebar gets on the bottom of the page.

    I’ve tried to troubleshoot but without success. please help me! I’m using FF3 on a mac but I’ve checked the site in IE7 (?) on winxp to with the same problem.

    Hope you understand. English isn’t my native language.

    Here is my stylesheet:

    Code:
    * { margin: 0; padding: 0; }
    html { overflow-y: scroll; }
    html, body { height: 100%; }
    body { font-size: 62.5%; font-family: Arial, Verdana, Helvetica, sans-serif; color: #272727;
    background: url(images/body-bg.jpg) top center repeat-x #F9FAF9; }
    ul { list-style: square inside; list-style-type: none; }
    ol { list-style: decimal inside; }
    a { outline: none; text-decoration: none; }
    a img { border: none; }
    img { vertical-align: middle; }
    table { border-collapse: collapse; }

    .floatLeft { float: left; }
    .floatRight { float: right; }
    .clear { clear: both; }
    .button { border: 1px solid #B5B2B5; background: #e7e7e7; padding: 1px 2px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #272727; }
    .button:hover { color: #79777A; }
    .search { border: 1px solid #B5B2B5; height: 18px; width: 127px; margin-right: 3px; float: left;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #272727; }

    p, li { font-size: 1.4 em; line-height: 1.2 em; padding-left: 0px;}
    P#intro-paragraph { font-family: Verdana, Helvetica, Arial, sans-serif; 2.0 em; font-weight: bold;
    line-height: 1.4 em; margin-top: 5px; }
    p#intro-paragraph span { font-size: 2.4 em; font-weight: bold; }
    p#intro-paragraph em { color: #000000; }
    a { color: #000000; font-weight: bold; }
    a:hover { color: #272727; }
    h1 { font-size: 3.6 em; font-family: Helvetica, Arial, Verdana, sans-serif;
    font-weight: normal;}
    h2 { font-size: 2.8 em; font-family: Helvetica, Arial, Verdana, sans-serif;
    font-weight: normal;}
    h3 { font-size: 2.6 em; font-family: Helvetica, Arial, Verdana, sans-serif;
    font-weight: normal; margin: 0 0 10px 0; }
    h4 { color: white; font-size: 2.0 em; margin-bottom: 25px; }

    #page-wrap { width: 844px; height: auto; margin: 0px auto; }
    #main-col { width: 520px; float: left; padding-left: 40px; }
    #sidebar { border-left-color: #9a9a9a; border-left-style: dashed; border-left-width: 1px; padding: 17px 0 0 10px; width: 230px; float: right; }
    #content-wrap { background: url(images/content-bg.jpg) repeat-y white top center;
    padding-bottom: 50px; }

    h1#logo { width: 834px; height: 215px;
    background: url(images/logo2.png) top center no-repeat;
    text-indent: -9999px;
    margin: 0px 0px -22px 5px;
    float: left; }
    #top-bar { padding: 0 0 0 0; }
    #top-bar p { display: none; }

    #menu-bar { padding-top: 0px; }
    ul#main-nav { width: 360px; height: 22px; padding-left: 515px; }
    ul#main-nav li { display: inline; }
    ul#main-nav a { color: black; font-size: 1.4em; padding: 10px;}
    ul#main-nav li a:hover { color: #272727; }

    .post h2 { font-size: 3em; margin-top: 20px;}
    .date_author { font-size: 0.8em; font-style: italic; }
    .meta { font-size: 0.8em; font-style: italic; }
    .more { font-size: 1em; font-style: italic; text-align: right; }
    hr { height: 1px; color: #9a9a9a; background-color: #9a9a9a; border: 0; margin: 5px 0 5px 0; }

    #footer { border-top-style: solid; border-top-width: 2px; border-top-color: #ededed; height: 100px; background: #e6e6e6; padding-top: 10px; }
    #footer-inside { width: 765px; margin: 0 auto; }

    # August 4, 2008 at 2:25 pm

    I’m no expert, but it looks to me like you didn’t clear your float before your footer. So before you see

    Code:
    < ? get_footer() ?>

    put

    Code:

    See if that works for you.

    # August 4, 2008 at 2:41 pm

    Well I’ve cleared the floats in the begining of my footer.php doc. It don’t do any difference.
    Thanks anyway though!

    # August 4, 2008 at 2:46 pm

    well, it was worth a shot. Good luck!

    # August 7, 2008 at 1:35 am

    I’ve tried and tried without any luck.
    Can’t somebody please help me, or at least give me a hint on what my problem may be. Chris?

    :cry:

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".