MozillaZine

Cannot style legend tag with css

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

Post Posted October 2nd, 2006, 4:48 am

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 Posted October 2nd, 2006, 7:44 am

Link to example?

jscher2000

User avatar
 
Posts: 10680
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted October 2nd, 2006, 4:42 pm

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>?

jqp

User avatar
 
Posts: 5070
Joined: November 17th, 2004, 10:56 am
Location: In a box

Post Posted October 2nd, 2006, 5:19 pm

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 Posted October 2nd, 2006, 5:39 pm

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

jscher2000

User avatar
 
Posts: 10680
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted October 2nd, 2006, 8:46 pm

Can you post a mockup or screen shot of what you want?

lukasnoname
 
Posts: 23
Joined: February 12th, 2003, 2:55 am
Location: Sweden

Post Posted October 3rd, 2006, 6:02 am

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

Return to Web Development / Standards Evangelism


Who is online

Users browsing this forum: No registered users and 2 guests