Cannot style legend tag with css

Discuss how to use and promote Web standards with the Mozilla Gecko engine.
Post Reply
lukasnoname
Posts: 23
Joined: February 12th, 2003, 2:55 am
Location: Sweden
Contact:

Cannot style legend tag with css

Post by lukasnoname »

How come I can't set the display or width with css on the legend tag?
I have a form with fieldsets and legends and I don't want the special appearance of the legend tag - I want it to simply act like a standard block element.
Setting width works in Safari, but not in Opera and Firefox. I'm not sure about IE(pc) yet because I use mac.
old np
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post by old np »

Link to example?
User avatar
jscher2000
Posts: 11742
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Post by jscher2000 »

I suspect a <legend> is an inline element like a <span>. In that case, you cannot set a width for it in Firefox. In my own application, I have padding, but not width. What happens if you set display:block for your <legend>?
User avatar
jqp
Posts: 5070
Joined: November 17th, 2004, 10:56 am
Location: In a box
Contact:

Post by jqp »

What happens if you set display:block for your <legend>?

It doesn't work. I spent some spare time poking at it today. I couldn't get any combination of anything to work. I don't know if there's some -moz- property you can hack at to make it work.
Unarmed
Posts: 4941
Joined: July 31st, 2003, 1:26 pm

Post by Unarmed »

<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=269908" title="Bug 269908 - &#60;legend&#62; default style changes restrict styling options">Bug 269908 - <legend> default style changes restrict styling options</a>
User avatar
jscher2000
Posts: 11742
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Post by jscher2000 »

Can you post a mockup or screen shot of what you want?
lukasnoname
Posts: 23
Joined: February 12th, 2003, 2:55 am
Location: Sweden
Contact:

Solved it

Post by lukasnoname »

Thanks all for the responses,

Btw, I solved it by setting display:block, float:left and width:100%. Float made it work, not sure why ;)

Best regards, Lukas
Post Reply