 |
 | Home | Contact Us | FAQ | Search & Site Map | Link to Us |
 | Sign In | Join | Other 45 Sites in Network |
| HomeDiscussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers |
Webmaster Forum / HTML, CSS, Scripts / CSS / February 2007Horizontal Line
Hello, I have 20 inputs in a web page and I would like to add a 200px gray horizontal line as a separator every 5 inputs to divide the form into sections. What is the best way to do this? Do I need to place each group of 5 inputs inside a div and define the div bottom border to 1px? Thanks, Miguel shapper wrote on 22 feb 2007 in comp.infosystems.www.authoring.stylesheets: > Hello, > > I have 20 inputs in a web page and I would like to add a 200px gray 200px wide? > horizontal line as a separator every 5 inputs to divide the form into > sections. > > What is the best way to do this? No, in programming and mark-up, there is no "best" way, as programming is an art. > Do I need to place each group of 5 inputs inside a div and define the > div bottom border to 1px? <style type='text/css'> .hrGray {color:gray;width:200px;} </style> <hr class='hrGray'> ... <hr class='hrGray'> ... <hr class='hrGray'> ......  SignatureEvertjan. The Netherlands. (Please change the x'es to dots in my emailaddress) Scripsit shapper: > I have 20 inputs in a web page and I would like to add a 200px gray > horizontal line as a separator every 5 inputs to divide the form into > sections. That would look odd if the font size is, say, 60px, which might be the smallest font size that the user can read. Did you intend to try to lock the font size? Well, you can't, but you can do some harm trying to do it. So make the width something more flexible, like 100% (why not?). > What is the best way to do this? Does it make sense to do this? If the lines would not correspond to any _logical_ grouping, it might be just a distraction. Assuming it makes sense, using <hr width="100%"> with hr { color: gray; background: gray; } is one option. The benefit is that the line appears even when CSS is off. > Do I need to place each group of 5 inputs inside a div and define the > div bottom border to 1px? That might be a more feasible option, though it might be argued that it's logically a <fieldset> rather than <div>, but <fiedset> has an obligatory <legend> and some idiosyncratic rendering features, so I reluctantly say that <div> is more practical. SignatureJukka K. Korpela ("Yucca") http://www.cs.tut.fi/~jkorpela/ > > I have 20 inputs in a web page and I would like to add a 200px gray > > horizontal line as a separator every 5 inputs to divide the form into > > sections. > > That would look odd if the font size is, say, 60px, which might be the > smallest font size that the user can read. Why would it "look odd" ? It would be the same 200px grey rule that the users with 12px text would see. Of course you'd now find fewer characters alongside it, but that's in no way "odd". Scripsit Andy Dingley: >>> I have 20 inputs in a web page and I would like to add a 200px gray >>> horizontal line as a separator every 5 inputs to divide the form [quoted text clipped - 5 lines] > Why would it "look odd" ? It would be the same 200px grey rule that > the users with 12px text would see. That's why it would look odd. > Of course you'd now find fewer > characters alongside it, but that's in no way "odd". The line would look riculously small. Try it and you'll see. SignatureJukka K. Korpela ("Yucca") http://www.cs.tut.fi/~jkorpela/ In article <1172155434.052252.199230@l53g2000cwa.googlegroups.com>, > > > I have 20 inputs in a web page and I would like to add a 200px gray > > > horizontal line as a separator every 5 inputs to divide the form into [quoted text clipped - 6 lines] > the users with 12px text would see. Of course you'd now find fewer > characters alongside it, but that's in no way "odd". Two giants, almost completely happily married, drive from their house (a converted two story block of flats) in their sedan (a converted furniture long distance removalist truck) to the adoption agency. They are shown a nice little fellow. "Yes, he is very cute... but it would look a bit odd... haven't you got any giant kids for adoption please?" "But why?" says the counsellor, "he is just a normal kid like most other kids, no one would bat an eyelid seeing you all out together..." Signaturedorayme Jukka K. Korpela wrote... >Assuming it makes sense, using <hr width="100%"> with >hr { color: gray; background: gray; } >is one option. Hello Jukka, Out of interest, would the following also work? <hr> with hr {border: 1px solid gray; width: 100%; } Apart from the width being included in the definition, is there any difference in the way this would be implemented? SignatureMartin Clark |
Reply to this Message |
 Sign In
 Join
 My Latest Posts My Monitored Threads My Blog My Photo Gallery My Profile My Homepage Start New Thread Enable EMail Alerts Rate this Thread
|
©2009 Advenet LLC Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.