Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    116
    Thanks
    1
    Thanked 0 Times in 0 Posts

    having trouble with sub classes

    Trying to put together a little page to show off my PHP work and my CSS is giving me trouble...


    First of all, here is the page and it's style sheet:
    http://www.maniacalmonkey.com/resume
    http://www.maniacalmonkey.com/resume/style.css
    (the style sheet looks like crap because I've been playing with it so much but it does validate)


    The problem I seem to be having is that the <divs> that I put within the <div class="block"> aren't displaying as inside that div in Netscape 7...looks fine in IE for whatever reason.

    If you look at the page in Netscape you'll see what I mean. There is an empty rectangle with images and text that fall in below it. However if you view the page in IE you see the images and text within that rectangle, which is what I was going for.

    I'll be the first one to admit that I don't fully understand CSS positioning yet. And for the life of me I can't figure out what rule I'm breaking or what property I'm leaving out that is causing this behavior. Does anyone have any ideas? Thanks.

  • #2
    New Coder
    Join Date
    Dec 2003
    Location
    California
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You just have to clear your floats.

    // freak

  • #3
    Regular Coder
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    116
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Interesting. Though I don't understand what the clear class described in the link actually does for me or where I should implement it. Care to clarify? Thanks.

  • #4
    Senior Coder
    Join Date
    Oct 2003
    Location
    Australia
    Posts
    1,963
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Not quite, more simple than that, in fact.
    change
    Code:
    #content .block .rightBlock {
            float:             left;
            text-align:     left;
    	position:	relative;
    }
    to
    Code:
    #content .block .rightBlock {
    	text-align:	left;
    	position:	relative;
    }
    ....and that fixes your problem.

    I take no responsibility for the above nonsense.


    Left Justified

  • #5
    Regular Coder
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    116
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Indeed, taking the float out of that class did make the text go into the box I wanted it to be in. However the images (the stuff in the leftBlock class) still defy the boundaries of the outer rectangle.

    Taking the float out of the leftBlock class makes it stay within the outer rectangle as well but then nothing is positioned the way I want it to be.

    You can see what I mean if you look at the page again. I'm going to tinker around a bit but feel free to throw in any other suggestions.

  • #6
    Senior Coder
    Join Date
    Oct 2003
    Location
    Australia
    Posts
    1,963
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK, this is a bit of a nasty hack, but if you put some kind of invisible element (maybe a div with visibility:hidden in css?) at the bottom of each bit of text, and gave it a a value of clear:left, or clear:both I'd imagine you might have a bit more luck.
    This is not a real good solution, but no other is jumping into my head.

    I take no responsibility for the above nonsense.


    Left Justified

  • #7
    New Coder
    Join Date
    Dec 2003
    Location
    California
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by mindlessLemming
    OK, this is a bit of a nasty hack, but if you put some kind of invisible element (maybe a div with visibility:hidden in css?) at the bottom of each bit of text, and gave it a a value of clear:left, or clear:both I'd imagine you might have a bit more luck.
    That's exactly what clearing your floats is...

    // freak

  • #8
    Regular Coder
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    116
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I get it now...I mean kinda.

    I'm not sure why it works but I figured out where to put it and it seems to have made the problem go away.

    Thanks.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •