advanced code snippet search

Posted By

LeeRJohnson on 11/15/08


Tagged

css fluid Framework blueprint bluetrip percentage


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

SpinZ
nightowl
LeeRJohnson


BlueTrip/BluePrint Fluid/Percentages Plugin

 / Published in: CSS
 

I'm still working on fine tuning the percentages across different browsers.

find out more at :http://bluetrip.org/

Expand | Embed | Plain Text 
  1. .container.fluid .span-1,
  2. .container.fluid .span-2,
  3. .container.fluid .span-3,
  4. .container.fluid .span-4,
  5. .container.fluid .span-6,
  6. .container.fluid .span-8,
  7. .container.fluid .span-12,
  8. .container.fluid .span-16,
  9. .container.fluid .span-16,
  10. .container.fluid .span-18,
  11. .container.fluid .span-24 {margin-right:1%; display:block; float:left;}
  12.  
  13. .container.fluid .span-1 {width:3.208%;}/* 1/24 */
  14. .container.fluid .span-2 {width:7.41%;}/* 1/12 */
  15. .container.fluid .span-3 {width:11.625%;}/* 1/8 */
  16. .container.fluid .span-4 {width:15.833%;}/* 1/6 */
  17. .container.fluid .span-5 {width:19.2%;}
  18. .container.fluid .span-6 {width:24.24%;}/* 1/4  25%  */
  19. .container.fluid .span-7 {width:28.458%;}
  20. .container.fluid .span-8 {width:32.66%;}/* 1/3  33% */
  21. .container.fluid .span-9 {width:36.875%;}/* 3/8 */
  22. .container.fluid .span-10 {width:41.083%;}
  23. .container.fluid .span-11 {width:45.291%;}
  24. .container.fluid .span-12 {width:49.49%;}/* 1/2  50% */
  25. .container.fluid .span-13 {width:53.708%;}
  26. .container.fluid .span-14 {width:58.916%;}/* 7/12 */
  27. .container.fluid .span-15 {width:62.125%;}
  28. .container.fluid .span-16 {width:66.333%;}/* 2/3 */
  29. .container.fluid .span-17 {width:70.541%;}
  30. .container.fluid .span-18 {width:74.75%;}/* 3/4 */
  31. .container.fluid .span-19 {width:78.958%}
  32. .container.fluid .span-20 {width:83.166%;}/* 5/6 */
  33. .container.fluid .span-21 {width:87.375%;}
  34. .container.fluid .span-22 {width:91.583%;}
  35. .container.fluid .span-23 {width:95.791%;}
  36.  
  37. .container.fluid .span-24 {width:99%; clear:both;}
  38.  
  39. .container.fluid .last {margin-right:0; }
  40.  
  41. .container.fluid .suffix-1 {padding-right:4.125%;}
  42. .container.fluid .suffix-2 {padding-right:8.25%;}
  43. .container.fluid .suffix-3 {padding-right:12.375%;}
  44. .container.fluid .suffix-4 {padding-right:17.5%;}
  45. .container.fluid .suffix-6 {padding-right:25.75%;}
  46. .container.fluid .suffix-8 {padding-right:34%;}
  47. .container.fluid .suffix-12 {padding-right:50.49%;}
  48. .container.fluid .suffix-16 {padding-right:67%;}
  49. .container.fluid .suffix-18 {padding-right:75.75%%;}
  50.  
  51. .container.fluid .prefix-1 {padding-left:4.125%;}
  52. .container.fluid .prefix-2 {padding-left:8.25%;}
  53. .container.fluid .prefix-3 {padding-left:13.375%;}
  54. .container.fluid .prefix-4 {padding-left:17.5%;}/* 1/6 */
  55. .container.fluid .prefix-6 {padding-left:25.75%;}
  56. .container.fluid .prefix-8 {padding-left:34%;}
  57. .container.fluid .prefix-12 {padding-left:50.49%;}
  58. .container.fluid .prefix-16 {padding-left:67%;}
  59. .container.fluid .prefix-18 {padding-left:75.75%;}
  60. .container.fluid .prefix-22 {padding-left:92.75%;}

Report this snippet  

You need to login to post a comment.