Grow your CSS skills. Land your dream job.

height 100% not working

  • # September 15, 2009 at 3:30 am

    I’m working on my first WordPress design and I’m running into some problems with CSS.

    The live url is: http://trombonetranscriptions.com/wordpress

    For some reason sidebar div is not extending to the bottom of the page, even though I have the height set to 100% (the parent div of ‘page-wrap’ is also set to height: 100%)

    My other problem is that some of my text is extending outside of my main-content div even though I have it set to a fixed number of pixels. This is particularly a problem when viewing a single post (http://trombonetranscriptions.com/wordp … offee-pot/). The single post problem especially has me stumped.

    This is a work in progress so please excuse the styling mess…

    Rob
    # September 15, 2009 at 4:54 am

    getting a 503 – your server ok?

    # September 15, 2009 at 4:59 am

    wow. that is weird. if you put a / at the the end of the url it works. try this link:

    http://trombonetranscriptions.com/wordpress/

    my other sites on the same server are up and running normally.

    why am i getting this error when i go to http://trombonetranscriptions.com/wordpress ????

    # September 15, 2009 at 5:03 am

    i think i’ve also determined that there is some kind of styling going on outside of my stylesheet.

    i figure this is the case because when i hard code a paragraph into the page.php file, it styles like it is supposed to and doesn’t run outside the div area. all p tags created from the dashboard, however, are not following the style rules.

    i started with the starkers theme which is supposed to be completely stripped of all styling. so i don’t know where this is coming from. it’s not showing up in firebug either. i’m soooo stumped here…

    # September 15, 2009 at 9:19 am

    Tricky one. There is no other style sheet being used besides "style.css"

    Meaning your problem most likely occurs in that style sheet. I noticed you have #sidebar listed twice in your css (lines 64 and 106). Try merging these two in your css. I would also place them at the bottom of the style.css script, to overwrite anything above it. See if either of those methods work.

    -T

    # September 15, 2009 at 2:53 pm

    Thanks for the reply Otis. Unfortunately it didn’t work :(

    This is so bizarre…

    # September 16, 2009 at 2:07 am

    Ok, I’ve tried containing my main-col and sidebar divs in a wrapper so I could then apply the appropriate background image to give the appearance of the sidebar extending all the way to the bottom, but this method (Faux Column Technique) has failed me as well.

    The live url is: http://trombonetranscriptions.com/wordpress/ . Any body have any ideas?

    # September 16, 2009 at 12:14 pm

    your sidebar is going to bottom ok on FF

    the single post has a problem wiht the message part of the form for rwply, it is too big, change the column size to make it fit….

    other than that, your problems are ok in FF

    Noticed how I have not said any other browser, as I don’t knwo what browser does not work the way it should…….

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

You must be logged in to reply to this topic.

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