CODEWITHSUNDEEP
htmlcssstylesheet
Kevin Redman
Kevin Redman

Reputation: 459

Styling definition lists horizontally with term ontop of definition

I have a piece of code, say 

<dl>
   <dt>term 1</dt>
   <dd>My data</dd>
   <dt>term 1</dt>
   <dd>My data</dd>
   <dt>term 1</dt>
</dl>

Using css(3), how would I achieve lining them up so that the order was like so?

Definition    Definition    ......
Term          Term

Thanks everyone!

Upvotes: 0

Views: 624

Answers (2)

GolezTrol
GolezTrol

Reputation: 116120

If they have a fixed width and height, or if they don't need to wrap to the next line, it should be possible with a little hacking:

http://jsfiddle.net/GolezTrol/hN34S/

Upvotes: 2

Joel Kinzel
Joel Kinzel

Reputation: 970

There is no way to do that without an additional wrapping element. Here is a really good site for styling definition lists: http://www.maxdesign.com.au/articles/definition/

Upvotes: 0

Related Questions