Discuss the Opera Web Standards Curriculum. Give us feedback, including suggesting improvements, pointing out errors, asking for help, and requesting more clarity in how to use the course to teach and learn.
By okaprinarjaya
Sunday, 29. March 2009, 19:42:25

Request learning material. Focus on nitty gritty of Layouting, Styling in Percent, and Em
Hello WSC team

I'am a student in a university. I build small web design community with my friends in my campus. I and some of my friends be the speaker for members of my community.
We have problems in CSS layouting. We have problem in layouting and styling in Percent, and Em. We don't understand how Percent, and Em work. We difficult to create background image size, and placing a background image with Percent,Em based layout.
Not just that, we also can't understand how to calculate background positioning using percent and em. It's harder than using pixel. It is very hard to calculate when creating a layout with faux column.
is it possible WSC team write in detail about layouting and styling with percent and em?
Thank you

By Erinyes
Wednesday, 1. April 2009, 17:38:34

With out going into detail:
- em = line height (so, 1em = 1line, 2em = 2lines, .5em = 0.5 size of 1 line)
- % = dimention proportionate to parent container.
I think what you mean to say is you wish for the theory on creating "elastic layouts".
Listening to what you have said, I would just say: "if it sounds wierd and unconventional, it's probably bad! take 2 steps back" (hint: background positioning with em/% units)
^
http://24ways.org/2006/compose-to-a-vertical-rhythm^
http://www.alistapart.com/articles/elastic
By okaprinarjaya
Friday, 3. April 2009, 05:05:58

Originally posted by Erinyes:
I think what you mean to say is you wish for the theory on creating "elastic layouts".
Yes! that's what i mean. What u mean with "It's probably bad, take 2 steps back" ?
any tutorial for css background in em / % unit?
Thank you

By daniiswara
Wednesday, 15. April 2009, 13:51:54

Hi Oka,
I knew one of the best implementation of elastic/liquid layout, please check
Tommy Olsson's sitetry to ctrl+[+] his site twice or more
By kaqfa
Sunday, 19. April 2009, 13:17:53

I use blueprint css lately, i think it's a great framework to make css grid easy.
Want to use liquid layout, we need only add liquid layout plugin.
Okay, i know many people say using css frameworks isn't good, but i still think it's very good tool to make a good design in strict time.