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

02-02-2005

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;
}

02-02-2005

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

02-02-2005

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

02-02-2005

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

02-02-2005

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.

02-02-2005

"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

02-02-2005

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

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
knowing where a block element is within the client element?		Javascript	1	10-09-2007 09:20 PM
Fo:Block can you check to see if a block contains any text by using the block id?	morrell	XML	1	10-10-2006 07:18 PM
In xml schema, what's the difference between attribute "final" and "block" in element "element"	tankbattle	XML	1	07-21-2006 07:51 AM
HELP: Relatively positioning a block element to an inline element in Mozilla.	Woolly Mittens	HTML	8	09-22-2003 06:29 AM