Startseite Erkunden Hilfe
Anmelden
caleb
/
pelican-elegant
Beobachten 1
Favorit hinzufügen 0
Fork 0
Dateien Issues 0 Pull-Requests 0 Wiki
Branch: columnal
Branches Tags
pelican-eleg...
/
resources
/
columnal-0.85
/
README.txt

README.txt 3.2 KB
Permalink Verlauf Originalformat

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667 
  1. ====================
    2. 

  2. COLUMNAL GRID SYSTEM
    3. 

  3. ====================
    4. 

  4. 

  5. Columnal is a project created by Pulp+Pixels - www.pulpandpixels.com
    6. 

  6. 

  7. The Columnal CSS grid system is a "remix" of a couple others with some custom code thrown in. The elastic grid system is borrowed from cssgrid.net, while some code inspiration (and the idea for subcolumns) are taken from 960.gs. The CSS reset is the famous reset created by the CSS rockstar, Eric Meyer.
    8. 

  8. 

  9. Please visit columnal.com for more information on the grid system.
    10. 

  10. 

  11. ===============================================
    12. 

  12. 

  13. The Columnal CSS includes necessary at the top of an html page should appear like the demo page, but similar to this: 
    14. 

  14. 

  15. <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    16. 

  16.   
    17. 

  17. <!-- The Columnal Grid (base, load first) -->
    18. 

  18. 	<link rel="stylesheet" href="css/columnal.css" type="text/css" media="screen" />
    19. 

  19. 

  20. <!-- Fixes for IE -->
    21. 

  21. 	<!--[if lt IE 9]>
    22. 

  22.     	<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen" />
    23. 

  23. 	<![endif]-->
    24. 

  24. 

  25. 	<!-- use "fixed-984px-ie.css" or "fixed-960px-ie.css for a 984px or 960px fixed width for IE6 and 7 -->
    26. 

  26. 	<!--[if lte IE 7]>
    27. 

  27. 		<link rel="stylesheet" href="css/fixed-984px-ie.css" type="text/css" media="screen" />
    28. 

  28. 	<![endif]-->
    29. 

  29. 	
    30. 

  30. <!-- Fixes for IE6, only needed if IE 6 will be supported - width must match 984px or 960px of css file used above -->
    31. 

  31. <!-- Use .imagescale to fix IE6 issues with full-column width images (class must be added to any image wider than the column it is placed into) -->
    32. 

  32. 	<!--[if lte IE 6]>
    33. 

  33. 		<link rel="stylesheet" href="css/ie6-984px.css" type="text/css" media="screen" />
    34. 

  34. 	<![endif]-->
    35. 

  35.   <!-- End fixes for IE -->
    36. 

  36. 

  37. <!-- Page building tools - Gray box colors and page debugging tools -->
    38. 

  38.     <link rel="stylesheet" href="css/build.css" type="text/css" media="screen" />
    39. 

  39. 

  40. ====================
    41. 

  41. CSS FILES
    42. 

  42. ====================
    43. 

  43. 

  44. columnal.css
    45. 

  45. 	• HTML Reset (Eric Meyer HTML Reset)
    46. 

  46. 	• Type and image settings (Columnal comes with basic type presets, but custom type control is encouraged, another option is a CSS type framework such as Tripoli CSS from devkick
    47. 

  47.     • Common base code for the CSS framework - this is where the columns are defined across browsers, and basic functions are added. Also includes Eric Meyer reset.
    48. 

  48. 	• Mobile stylesheet (moves the layout to a single column for mobile viewing)
    49. 

  49. 

  50. custom.css
    51. 

  51.     • Place custom page layouts here - see notes in file
    52. 

  52. 

  53. build.css
    54. 

  54. 	• Page building tools - Gray box colors and page debugging tools
    55. 

  55. 

  56. ====================
    57. 

  57. CSS Files for Internet Explorer
    58. 

  58. ====================
    59. 

  59. 

  60. ie.css
    61. 

  61.     CSS "fixes" for Internet Explorer (across versions), the fixed width for Internet Explorer 8 can be set at the bottom of this page, it is NOT SET by default. This means IE8 will follow the width of the browser down to a ridiculously thin dimension.
    62. 

  62. 

  63. fixed-984px-ie.css or fixed-960px-ie.css
    64. 

  64.     CSS "fixes" for Internet Explorer 6 and 7. This sets the page width to a fixed width of either 984px or 960px, adding better support for the older browsers.
    65. 

  65. 

  66. ie6-984px.css or ie6-960px.css
    67. 

  67.     CSS "fixes" unique to Internet Explorer 6. Fixes for IE6, only needed if IE 6 will be supported - use .imagescale to fix IE6 issues with full-column width images (class must be added to any image wider than the column it is placed into)
    68.