SitePoint Sponsor |
|
User Tag List
Results 1 to 25 of 137
-
Jul 4, 2003, 09:46 #1
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Useful HTML elements that 90% of all developers are unaware of
This week I "discovered" the <fieldset> element, which has been around for several years, but was completely unknown to me - until now (thank you beetle !
)
I really like this way of creating something similar to a GroupBox/Frame control in a WinForms application (<legend> == Text/Caption)
Think I will use it very extensively to group related fields in the future
Another element, that I knew existed, and also have used a lot in my forms is the <label> element
However, I've noticed that using <label>s next to form elements is unusual, I guess it can't hurt to talk about that one too
In fact, why not encourage you all to resurrect "unknown" elements, attributes etc that you believe are useful but rarely used by the majority?
Finally, a little example, how to use <fieldset> and <label>
Code:... <form action=""> <fieldset> <legend>My favourite thing is...</legend> <input type="radio" id="optFav0" name="optFav"> <label for="optFav0">Raindrops on roses</label><br> <input type="radio" id="optFav1" name="optFav"> <label for="optFav1">Whiskers on kittens</label><br> <input type="radio" id="optFav2" name="optFav"> <label for="optFav2">Bright copper kettles</label> </fieldset> <p><input type="submit"></p> </form> ...
-
Jul 4, 2003, 10:04 #2
- Join Date
- Apr 2002
- Posts
- 38
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I've got two, one is an HTML attribute, the other is a CSS gem.
Well, I just recently finished writing an XHTML/CSS frontend to a SQL Server database at work, and one of the requirements was to print out coversheets for documents contained in the database. This usually isn't too hard, the catch was that my boss wanted several records printed out at once, and all on seperate pages.
At first I thought I'd have to do some fancy JavaScript or use some kind of messy browser plugin, when I realized through the magic of CSS and XHTML, that I could use the page-break-after which automatically breaks to a new page after the closing tag of the container element!
A nice little HTML element that's been around for awhile, but I haven't seen used often is the NOWRAP attribute, which is a lifesaver when you just can't have that table cell wrap.
-
Jul 4, 2003, 10:08 #3
Forgotten elements/properties:
HTML tags:
<abbr>
<acronym>
<caption>
<col>
<colgroup>
<th>
<thead>
<tbody>
<tfoot>
CSS Properties:
text-transform
white-space
position: fixed;
margin: auto; seems to be unknown too
-
Jul 4, 2003, 10:43 #4
- Join Date
- Oct 2001
- Location
- Tucson, Arizona
- Posts
- 1,858
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
What about the HTML <blink> tag? That's one you don't see being used too often these days.
-
Jul 4, 2003, 10:49 #5
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by mattjacob
-
Jul 4, 2003, 10:50 #6
Originally Posted by mattjacob
Code:.annoying { text-decoration: blink; }
-
Jul 4, 2003, 11:18 #7
- Join Date
- Oct 2001
- Location
- Tucson, Arizona
- Posts
- 1,858
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by jofa
Code:form.oneLineForm { display: inline; }
-
Jul 4, 2003, 11:32 #8
-
Jul 4, 2003, 12:32 #9
- Join Date
- Apr 2002
- Location
- Salford / Manchester / UK
- Posts
- 4,838
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
90% of developers ? hmmm....i must fall into the 10% then...
but while i'm here...any of you ever use the <q> tag ?re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]
WaSP Accessibility Task Force Member
splintered.co.uk | photographia.co.uk | redux.deviantart.com
-
Jul 4, 2003, 12:37 #10
- Join Date
- Oct 2001
- Location
- Tucson, Arizona
- Posts
- 1,858
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by redux
-
Jul 4, 2003, 12:50 #11
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by redux
Originally Posted by Poll in HTML and XHTML Forum
, but I still think the number 90% is correct
For example; does this forum use the <label> tag?
-
Jul 4, 2003, 12:54 #12
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
And I still think this thread is a good idea, and Vinnie posting e.g. the <th> is excellent, beacuse a lot of people don't know that it exists, another lot of people never uses it etc etc
-
Jul 4, 2003, 13:20 #13
- Join Date
- Aug 1999
- Location
- Lancaster, Ca. USA
- Posts
- 12,305
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by jofa
<th> is one of my favorite tags. I use it whenever I create a table for the column headers. Makes formatting so much easier because I can apply it directly to the tag instead of a class to differentiate the column headers from standard data cells.
What about <tfoot>? I see a lot of people use <tbody> but hardly ever see <tfoot> used. While we are on the subject of tables, I haven't seen many people use the caption, colgroup or col elements in the past either. Does anyone use any of these?
-
Jul 4, 2003, 13:40 #14
- Join Date
- Apr 2002
- Location
- Salford / Manchester / UK
- Posts
- 4,838
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
i use <label> all the time...i'm required to make my work site (uk university) accessible to at least W3C WAI Level A or better...so labelling my form elements is a must...and it has a huge number of "coincidental" advantages (e.g. checkboxes with a proper label associated can be ticked by clicking on the label text itself, and not just the box...making them a lot easier to "hit"
)
re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]
WaSP Accessibility Task Force Member
splintered.co.uk | photographia.co.uk | redux.deviantart.com
-
Jul 4, 2003, 14:04 #15
- Join Date
- Oct 2001
- Location
- Tucson, Arizona
- Posts
- 1,858
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by redux
Code:<label for="email" accesskey="e"><span class="underline">E</span>mail address:</label> <input name="email" type="text" id="email" />
Code:label { cursor: pointer; }
-
Jul 4, 2003, 14:44 #16
I'm a heavy user of <fieldset>, <legend>, and <label>
. The first time I used fieldset and legend at work people thought I used some kind of CSS hack to get the "framed" appearance
.
-
Jul 4, 2003, 15:59 #17
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by mattjacob
-
Jul 4, 2003, 16:11 #18
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Two well known attributes, but does everyone know what they are meant for?
alt
Originally Posted by w3.org
Originally Posted by w3.org
Other browsers (read: Mozilla) display a "tool tip" only when title is set
And then some people get it all wrong and accuse Mozilla of being wrong
-
Jul 4, 2003, 20:18 #19
- Join Date
- Aug 2002
- Location
- Burpengary, Australia
- Posts
- 4,495
- Mentioned
- 0 Post(s)
- Tagged
- 1 Thread(s)
I've used <th> for a while now, the first time I found it was when I was modding phpBB and they used <th> and I did a search and found out what it was.
<fieldset> and <legend>, I also knew of their existence but only because they are used at PHP and I saw them, thought they looked interesting and checked out the code.
There is a lesson to be learned here, if you visit another site and think something there is nifty, check the source. It might just be something simple that you never knew about
-
Jul 4, 2003, 20:19 #20
- Join Date
- Aug 2002
- Location
- Burpengary, Australia
- Posts
- 4,495
- Mentioned
- 0 Post(s)
- Tagged
- 1 Thread(s)
Also, with <strong> and <em>, I've heard somewhere (I think) that they are occasionally rendered differently in different browsers but should still be used as aural browsers and such use them to accent words and stuff.
-
Jul 4, 2003, 21:00 #21
- Join Date
- Sep 2001
- Location
- Vancouver
- Posts
- 809
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by mattjacob
-
Jul 4, 2003, 21:11 #22
- Join Date
- May 2003
- Location
- Liverpool
- Posts
- 361
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by Darin
-
Jul 4, 2003, 23:47 #23
- Join Date
- Jun 2003
- Location
- European Union
- Posts
- 1,488
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by vgarcia
-
Jul 5, 2003, 01:39 #24
- Join Date
- Oct 2001
- Location
- Tucson, Arizona
- Posts
- 1,858
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by hurricane.uk
-
Jul 5, 2003, 03:23 #25
- Join Date
- Mar 2002
- Location
- Svíþjóð
- Posts
- 4,080
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by w3.org
Bookmarks