Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Example of how to use nested grids with pure css

The docs don't contain any example of nested grid. Could someone post an example of nested grid

like image 423
aWebDeveloper Avatar asked Oct 27 '25 22:10

aWebDeveloper


1 Answers

Trick is to use nested pure-g inside pure-u-* class

<link href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css" rel="stylesheet"/>
<div class="pure-g">
        <div class="pure-u-16-24">
            <span>Msg goes here</span>
        </div>
        <div class="pure-u-8-24">
            <div class="pure-g">
                <div class="pure-u-1-2">
                    <button>Text</button>
                </div>
                <div class="pure-u-1-2 l-box">
                    <select>
                       <option value="">Select </option>
                    </select>
                </div>
            </div>
        </div>
    </div>
like image 75
aWebDeveloper Avatar answered Oct 29 '25 16:10

aWebDeveloper



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!