IE block element "width" broken or am I just stupid? : )

Discussion in 'HTML' started by Noozer, Feb 2, 2005.

  1. Noozer

    Noozer Guest

    I've been asked to modify the output of one of our pages. (partial HTML and
    CSS below)...

    The page displays a number of groups of categories. In these categories
    there are a number of checkboxes with descriptions to the right. Right now,
    these descriptions stay on one line. We need to use some longer descriptions
    and would like the description to wrap if it doesn't fit the width of our
    DIV. I cannot see any way to do this. IE just makes the DIV wider to
    accomodate the text.

    Should IE be wrapping and it's just broken, or am I misunderstanding block
    elements? Is there a way to get the wrapping to occur?

    <div class="category">
    <span class="IssueItem"><input id="Iss29" type="checkbox" name="2|9|29"
    >Issue 1</span>

    <span class="IssueItem"><input id="Iss30" type="checkbox" name="2|9|30"
    >Another issue, number 2</span>

    <span class="IssueItem"><input id="Iss31" type="checkbox" name="2|9|31"
    >Issue 3</span>

    <span class="IssueItem"><input id="Iss32" type="checkbox" name="2|9|32"
    >This is issue number 4</span>

    <span class="IssueItem"><input id="Iss94" type="checkbox" name="2|9|94"
    >Issue 5</span>

    </div>

    CSS...

    ..category{
    clear: none;
    background-color: #FFFFFF;
    margin: 0;
    padding: .3em;
    float: left;
    width: 10.5em;
    }

    ..IssueItem {
    display: block;
    clear:none;
    padding: 0;
    margin:0;
    }
     
    Noozer, Feb 2, 2005
    #1
    1. Advertising

  2. Noozer

    Oli Filth Guest

    Noozer wrote:
    > I've been asked to modify the output of one of our pages. (partial HTML and
    > CSS below)...
    >
    > The page displays a number of groups of categories. In these categories
    > there are a number of checkboxes with descriptions to the right. Right now,
    > these descriptions stay on one line. We need to use some longer descriptions
    > and would like the description to wrap if it doesn't fit the width of our
    > DIV. I cannot see any way to do this. IE just makes the DIV wider to
    > accomodate the text.
    >
    > Should IE be wrapping and it's just broken, or am I misunderstanding block
    > elements? Is there a way to get the wrapping to occur?
    >


    That works fine in both IE and FF for me. With .category { width: 10.5em
    }, no wrapping occurred in either, but as soon as I dropped the width
    down to, say, 5em, wrapping occurred in both.



    P.S. If you expect people to come up with solutions for your HTML, it's
    courtesy on this group to post a URI to a test page rather than just
    posting bits of code. To test your code, I had to open an editor, paste
    in the HTML, then type in a DOCTYPE, a HEAD element, <HTML><BODY>,
    </BODY></HTML>, and then copy and paste your CSS into a <STYLE
    type="text/css"></STYLE> element, and then finally run the page. I only
    did all this cause I'm bored and have nothing better to do. Busy people
    will simply not bother helping you, so maximise your chances and post a
    URI instead!

    --
    Oli
     
    Oli Filth, Feb 2, 2005
    #2
    1. Advertising

  3. Noozer

    Noozer Guest

    "Oli Filth" <> wrote in message
    news:E27Md.1170$...
    > Noozer wrote:
    > > I've been asked to modify the output of one of our pages. (partial HTML

    and
    > > CSS below)...
    > >
    > > The page displays a number of groups of categories. In these categories
    > > there are a number of checkboxes with descriptions to the right. Right

    now,
    > > these descriptions stay on one line. We need to use some longer

    descriptions
    > > and would like the description to wrap if it doesn't fit the width of

    our
    > > DIV. I cannot see any way to do this. IE just makes the DIV wider to
    > > accomodate the text.
    > >
    > > Should IE be wrapping and it's just broken, or am I misunderstanding

    block
    > > elements? Is there a way to get the wrapping to occur?
    > >

    >
    > That works fine in both IE and FF for me. With .category { width: 10.5em
    > }, no wrapping occurred in either, but as soon as I dropped the width
    > down to, say, 5em, wrapping occurred in both.


    Hrm... then what am I doing differently?...

    > P.S. If you expect people to come up with solutions for your HTML, it's
    > courtesy on this group to post a URI to a test page rather than just
    > posting bits of code.


    Won't do you much good unless you want to come over and plug into my LAN.

    Definately understand that having the actual page makes it much easier
    though.
     
    Noozer, Feb 2, 2005
    #3
  4. Noozer

    Oli Filth Guest

    Noozer wrote:
    > "Oli Filth" <> wrote in message
    > news:E27Md.1170$...
    >>
    >>That works fine in both IE and FF for me. With .category { width: 10.5em
    >>}, no wrapping occurred in either, but as soon as I dropped the width
    >>down to, say, 5em, wrapping occurred in both.

    >
    >
    > Hrm... then what am I doing differently?...


    Umm no idea! I copied and pasted your HTML and CSS verbatim.


    --
    Oli
     
    Oli Filth, Feb 2, 2005
    #4
  5. Noozer wrote:
    > "Oli Filth" <> wrote in message
    > news:E27Md.1170$...
    >
    >> Noozer wrote:
    >>
    >>> We need to use some longer descriptions and would like the
    >>> description to wrap if it doesn't fit the width of our DIV. I
    >>> cannot see any way to do this. IE just makes the DIV wider to
    >>> accomodate the text.
    >>>
    >>> Should IE be wrapping and it's just broken, or am I
    >>> misunderstanding block elements? Is there a way to get the
    >>> wrapping to occur?
    >>>

    >>
    >> That works fine in both IE and FF for me. With .category { width:
    >> 10.5em }, no wrapping occurred in either, but as soon as I dropped
    >> the width down to, say, 5em, wrapping occurred in both.

    >
    >
    > Hrm... then what am I doing differently?...


    Without actually seeing the page you're using (see, this is why
    providing URIs is a good idea), I would guess that you're using a DTD
    which throws IE into quirks mode, whereas the DTD that Oli Filth added
    triggered standards mode.
     
    Leif K-Brooks, Feb 2, 2005
    #5
  6. "Noozer" <> wrote:

    > Hrm... then what am I doing differently?...


    A good question. You have the data needed for an answer, we don't.

    >> P.S. If you expect people to come up with solutions for your HTML, it's
    >> courtesy on this group to post a URI to a test page rather than just
    >> posting bits of code.

    >
    > Won't do you much good unless you want to come over and plug into my LAN.


    Oh, that would be trivial, but we are real hackers: we _know_ how to crack
    into your system, but we don't actually do that, it would be illegal.

    Seriously, if you ask help in public, take some trouble to make the problem
    visible to the public.

    > Definately understand that having the actual page makes it much easier
    > though.


    Yet you decided to keep your problem to yourself. Your choice. HTH.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, Feb 2, 2005
    #6
  7. Noozer

    Noozer Guest

    "Oli Filth" <> wrote in message
    news:W19Md.301$...
    > Noozer wrote:
    > > "Oli Filth" <> wrote in message
    > > news:E27Md.1170$...
    > >>
    > >>That works fine in both IE and FF for me. With .category { width: 10.5em
    > >>}, no wrapping occurred in either, but as soon as I dropped the width
    > >>down to, say, 5em, wrapping occurred in both.

    > >
    > >
    > > Hrm... then what am I doing differently?...

    >
    > Umm no idea! I copied and pasted your HTML and CSS verbatim.


    Sorry... just "thinking out loud". : )

    My DOCTYPE:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    ....but I'll try and get a copy where it can be accessed.
     
    Noozer, Feb 2, 2005
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. AndrewF
    Replies:
    1
    Views:
    822
    Bruce Barker
    Oct 10, 2005
  2. Brandon McCombs
    Replies:
    4
    Views:
    529
    Richard Wheeldon
    Aug 28, 2006
  3. morrell
    Replies:
    1
    Views:
    992
    roy axenov
    Oct 10, 2006
  4. antred
    Replies:
    11
    Views:
    468
    Ben Finney
    Dec 7, 2006
  5. rincewind

    stupid, STUPID question!

    rincewind, Apr 19, 2009, in forum: HTML
    Replies:
    25
    Views:
    1,049
Loading...

Share This Page