div border and width problem in ie6, ff

Discussion in 'CSS' started by livemixlove, Apr 21, 2008.

0
  1. #1
    Hi All,

    I'm new here on these forums... so I'll do my best.

    The link to the site is http://beta.bwell-inc.com

    Problem 1: Div border

    I have a dotted border that only works in ie6, in all other browsers it does not appear. It should go right below the main top navigation bar.

    CSS:

    #hr_break {
    border-top:1px dotted #CCCCCC;
    margin: 1px 0 0 0;
    }

    HTML:
    <div id="hr_break"></div>


    I have a feeling it has to do with come messy div embedding, but I havn't been able to find the source of the inconsistency.

    Problem 2: div width and height in ie6

    the main column of the site renders below where it should. I tried float:left and position:inherit, and messing with widths, but ie6 doesn't seem to respond.

    Here's the css:

    #component {
    float: left;
    position:inherit;
    width: 430px;
    margin: -5px 0px 10px 10px;
    padding: 0 0 0 0;
    text-align:left;
    }

    #maincolumn {
    float: left;
    width: 615px;
    min-height: 380px;
    margin: 0 0px 0 0;
    padding: 0 0px 0 0;
    }

    .blog { padding: -10px 0 0 -40px;
    margin: 0px 0 0 -15px;}

    There are a lot of nested divs, so you might just want to look at the url's source code for the html. The divs to look for are "maincolumn," "component," and maybe "blog"

    Thanks for any help.
     
    livemixlove, Apr 21, 2008 IP
  2. livemixlove

    livemixlove Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    ....well, no one responded, but for the life of me I can't figure out why some pages still have a float that drops down. I have gotten rid of all the margin/padding, and the content is not seemingly too big to fit in the given container, but it just won't go up. Hmph.
     
    livemixlove, Apr 27, 2008 IP
  3. ein2310

    ein2310 Peon

    Messages:
    98
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Problem 1: Div border:

    You wont get the border untill you add something inside the div <div id="hr_break">&nbsp;</div>


    Problem 2: I didn't get it clearly... if there's a live example it would be good...
     
    ein2310, Apr 28, 2008 IP
  4. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You'll need to post the HTML. I have no clue what position: inherit is supposed to do.

    I'm surprised that you get a dotted border on something in IE6, cause as I understand it, dotted is something IE6 doesn't understand (makes dashes instead... IE7 is okay with this).

    You have two floats, and one is dropping down only in IE6? Your situation may be different as you have a lot of weird, and deprecated things (like, you can't have negative padding-- negative margins are okay, but not padding), but read this:
    http://www.sitepoint.com/forums/showpost.php?p=1374925&postcount=15

    It may well be the double margin float bug... or for any number of reasons, IE6 thinks there's not enough room to hold your two floats side by side. Other browsers will let the content of the second float hang out a bit, while IE6 extends the width of the box (sometimes) to accommodate content, which then can make the box too wide to fit. Esp if everything looks okay in Opera, FF, Safari, etc.
     
    Stomme poes, Apr 29, 2008 IP