Hi Stephen,
Personally, I like to use dl for Q&A features with the dt tag as the question
and the dd tag as the answer. It gives me control over how the two different
elements appear (Q in bold for ex) without assigning id's.
Another method could be the alternating table rows trick, just with a ul
though. Example: li class="odd" and alternate with li class="even" and then
assign those classes with whatever styling you want.
Hope this helps!
Jenn Mears-Nickerson
Jenn Mears Web Design LLC
39B Northey Street
Salem, MA 01970
617-816-1209
LinkedIn
Facebook
Twitter
----------------------------------------
From: Stephen Tang <clowwizarder...@gmail.com>
Sent: Friday, March 13, 2009 11:37 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] "Q" and "A" (Question and Answer) format using ul
Hello,
I saw a FAQ page where it listed a question followed by an answer as
follows (fictional question and answer below):
Q. How do I login?
A. You log in by clicking on the login link.
The HTML markup is an unordered list (ul), where the list (li) have
background images for the "Q." and "A."
ul.QandA li.Q {
background:transparent url(../images/img_Q.gif) no-repeat scroll 0 2px;
padding:0 0 0 20px;
}
ul.QandA li.A {
background:transparent url(../images/img_A.gif) no-repeat scroll 0 2px;
padding:0 0 16px 20px;
}
Does CSS2.1 allow a way to actually use "Q." and "A." as text? Or
maybe a different markup (dl?) should be used?
I know the background image technique is well-known
(http://css.maxdesign.com.au/listutorial/introduction.htm), but since
in this example, it's just "Q" and "A", I was hoping there is a way
not to use images.
Thanks,
Stephen
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
