cfgcjm Posted February 28, 2008 Share Posted February 28, 2008 I'm using a form with a <fieldset> does anyone know how to remove or change the properties of this. border: & outline: do not work Quote Link to comment Share on other sites More sharing options...
AndyB Posted February 28, 2008 Share Posted February 28, 2008 Surely setting the border color to match the background will make it invisible. Isn't the whole point of the fieldset tag to show which form inputs belong to the logical group titled by the legend tag? Why would you want to functionally degrade it? Quote Link to comment Share on other sites More sharing options...
cfgcjm Posted February 28, 2008 Author Share Posted February 28, 2008 This is my code, the reason for the fieldset is not used to group, it's rather used because without it the code is invalid and with it does validate <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <title>St. John's UCC : Web Survey</title> <style type="text/css" media="all"> <!-- @import url(hpn.css); --> </style> </head> <body class="zerowhite" onload="FP_preloadImgs(/*url*/'images/jcornero.gif')"> <div id="wrappera"> <div id="headera"> <div id="journallogo"> </div><!--journallogo--> <div id="journalheadline"> </div><!--journalheadline--> <div id="journalheadtxt" style="width:400px;"> <span class="bigletter">S</span>T. <span class="bigletter">J</span>OHN'S <span class="bigletter">U</span>NITED <span class="bigletter">C</span>HURCH OF <span class="bigletter">C</span>HRIST </div><!--journalheadtxt--> <div id="journalmintxt"> WEBSITE SURVEY </div><!--journalmintxt--> <div id="bar"> Please Complete the Survey Below <div id="lcorner"> </div><!--lcorner--> <div id="rcorner"> </div><!--rcorner--> <div id="bara"> </div><!--bara--> <div id="bod"> <div id="formFields"> <form action="#" method="post"> <fieldset> <label for="Q1">1. What is your age?</label><br /> <p><input name="Q1" type="radio" class="radio" value="Under 18" checked="checked" />18 & Under</p> <p><input name="Q1" type="radio" class="radio" value="19-25" />19-25</p> <p><input name="Q1" type="radio" class="radio" value="26-40" />26-40</p> <p><input name="Q1" type="radio" class="radio" value="41-55" />41-55</p> <p><input name="Q1" type="radio" class="radio" value="56-75" />56-75</p> <p><input name="Q1" type="radio" class="radio" value="Over 75" />Over 75</p><br /> <label for="Q2">2. How would you rate yourself as an Internet user?</label><br /> <p><input name="Q2" type="radio" class="radio" value="Beginner" checked="checked" />Beginner</p> <p><input name="Q2" type="radio" class="radio" value="Average"/>Average</p> <p><input name="Q2" type="radio" class="radio" value="Expert"/>Expert</p><br /> <label for="Q3">3. How did you first hear about our website?</label><br /> <select name="Q3" class="radio"> <option>Please choose one</option> <option>Publication</option> <option>Search Engine</option> <option>Friend / Relative</option> <option>UCC / Penn Central Website</option> <option>Other</option> </select><br /><br /> <label for="Q4">4. How often do you visit our site?</label><br /> <select name="Q4" class="radio"> <option>Please choose one</option> <option>Daily</option> <option>More than once a week</option> <option>Once a week</option> <option>2-3 times a month</option> <option>Monthly</option> <option>Less than Monthly</option> <option>First time here</option> </select><br /><br /> <label for="Q5">5. How satisfied are you with your experience at stjohnsuccjonestown.org?</label><br /> <p><input name="Q5" type="radio" class="radio" value="Very satisfied" checked="checked" />Very satisfied</p> <p><input name="Q5" type="radio" class="radio" value="Somewhat satisfied" />Somewhat satisfied</p> <p><input name="Q5" type="radio" class="radio" value="Neutral" />Neutral</p> <p><input name="Q5" type="radio" class="radio" value="Dissatisfied" />Dissatisfied</p> <p><input name="Q5" type="radio" class="radio" value="Very dissatisfied" />Very dissatisfied</p><br /> <label for="Q6">6. If you are not totally satisfied, please describe the reasons for your dissatisfaction below.</label><br /> <textarea name="Q6" cols="0" rows="0" class="radio"></textarea><br /><br /> <label for="Q7">7. Please tell us what can be done to improve the quality of the information on our website: </label><br /> <textarea name="Q7" cols="0" rows="0" class="radio"></textarea><br /><br /> <label for="Q8">8. What is it about this site that you would most like to see improved?</label><br /> <textarea name="Q8" cols="0" rows="0" class="radio"></textarea><br /><br /> <label for="Q9">9. What changes, additional features, or information would you like to see on our website?</label><br /> <textarea name="Q9" cols="0" rows="0" class="radio"></textarea><br /><br /> <input type="submit" name="submitbutton" id="submitbutton" value="Submit" /> </fieldset> </form> </div><!--formFields--> </div><!--bod--> </div><!--bar--> </div><!--headera--> </div><!--wrappera--> </body> </html> Quote Link to comment Share on other sites More sharing options...
cfgcjm Posted February 28, 2008 Author Share Posted February 28, 2008 using border-color: does not work because the border is not a solid border, it is inset or something...and the border style property does not modify it. any other ideas? Quote Link to comment Share on other sites More sharing options...
haku Posted February 28, 2008 Share Posted February 28, 2008 I don't know if it will work or not, but try setting the border-width to zero: fieldset { border-width: 0; } If worse comes to worse, you could replace it with divs. Its not very semantic, and as such not ideal, but your code will validated if you do this, and it will get rid of the fieldset borders. Quote Link to comment Share on other sites More sharing options...
dbrimlow Posted February 28, 2008 Share Posted February 28, 2008 Here is a good article on form styling. More importantly it gives you a good idea of HOW to code your forms in the first place, AND use css to style them. Copy and past the code of the example to reverse engineer to fit your style needs. HOWEVER! It is important to note that form controls are, for the most part, OS and browser skin dictated to a very large extent. So attempting to style them for cross browser/platform constancy is absolutely futile -- as graphically illustrated by Roger Johanson's article - Styling form controls with CSS, revisited It is worth seeing. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.