Found something you all might like - to do with fieldsets

Craig321

Craig321

Craig321

Soldato
Joined
2 May 2004
Posts
19,950
Hi,

I'm sure some of/a lot of you like using fieldsets... they look especially nice in IE but not particularly nice in Mozilla.

I've been writing a registration system recently and have been using some fieldsets but didn't like the look of them in Mozilla, so went on the hunt for some CSS or a hack.

Found this:
Code: 
fieldset {
  -moz-border-radius: 6px;
  border: 1px solid #CFCFC5; 
  }

label {
  display: block;
  font-size: 8pt;
  font-weight: bold;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  padding-top:1em;
  }

legend {
  color: #6085B2;
  font-weight: bold;
  margin: 0;
  }

<![if !IE 5]>
fieldset {
  border: 1px solid #CFCFC5; 
  padding: 20px;
  margin-top: 10px;
  margin-bottom: 1px;
  }
<![endif]>

Makes fieldsets look very nice in Mozilla as well as IE :D

Just thought I'd share it with you all ;)

Craig.
 
Hmm, interesting - I used some fieldsets in an intranet app I wrote a year or so ago, might go hack the code tomorrow to sweeten it up a little :)
 
Right, I've done some of my own edits.

Stick this in your <head>

Code: 
<![if !IE]>
<link href="stylesheet_mo.css" rel="stylesheet" type="text/css"/>
<![endif]>

<![if IE]>
<link href="stylesheet_ie.css" rel="stylesheet" type="text/css"/>
<![endif]>

Within stylesheet_mo.css put this an all your other CSS for Mozilla:

Code: 
fieldset {
  -moz-border-radius: 6px;
  border: 1px solid #CFCFC5; 
  }

legend {
  color: #0046d5;
  margin: 0;
  }

then in stylesheet_ie.css put this and all your other CSS for IE (copy paste all by fieldset/legend CSS if your CSS is the same for IE and Mozilla:

Code: 
/**/

Now IE will read from stylesheet_ie.css so it'll keep it's original fieldset/legend look and Mozilla will read from stylesheet_mo.css so it'll have the nice rounded good looking fieldset.

Enjoy :)
 
You must log in or register to reply here.
Back
Top Bottom