article:
Typography: Ligature Symbols
article:
Typography: Indi36

Elements Design: One% CSS Grid Fluid CSS Grid System

Advertisement

"One% CSS Grid is a 12 column fluid CSS grid system. It’s been designed as a base for building responsive web layouts easily, quickly and with minimum effort. You don’t have to take care of resizing and rearanging your layout for each platform separatelly. One% CSS Grid will do all this for you."


Screenshots

Resource: One% CSS Grid Fluid CSS Grid System


Implementation

<head>

<meta name="viewport" content="width=device-width"/>
<link rel="stylesheet" href="onepcssgrid.css" />

<body>

<div class="onepcssgrid-1200">

    <div class="onerow">
        <div class="col3">Column 3</div>
        <div class="col3">Column 3</div>
        <div class="col3">Column 3</div>
        <div class="col3 last">Column 3</div>
    </div>

    <div class="onerow">
        <div class="col2">Column 2</div>
        <div class="col8">Column 8</div>
        <div class="col2 last">Column 2</div>
    </div>

</div>

Compatibility

- Chrome, Opera, Safari, Internet Explorer 9+* and platforms PC, MAC, Android, Apple (iPad, iPhone), even Amazon Kindle;
- It works without problems even on IE7 and IE8 but they don’t support CSS3 Media Queries so it’s necessary to use JavaScript to push them to work with it;



source
dowload

Advertisement
Tags: responsive, grid, system, fluid, css3, css2, html5, develop, desktop, mobile, grid system

Leave a Comment

No Comment

© Creative3x Ltd.