NEC学习 ---- 布局 -三列，右侧自适应

效果如图

html代码:

<div class="g-bd3 f-cb">
    <div class="g-sd31">
        <p>我是左侧</p>
    </div>
    <div class="g-sd32">
        <p>我是中间</p>
    </div>
    <div class="g-mn3">
        <div class="g-mn3c">
            <p>我是右侧自适应</p>
        </div>
    </div>
</div>

css代码:

.g-bd3{ width:980px;border:3px ridge #3f34e7; margin:45px auto;
} .g-sd31,.g-sd32{ float: left; width:230px; position: relative;
} .g-sd31{ width:190px; margin-right:10px;
} .g-mn3{ float: right; width:100%; margin-left: -460px;
} .g-mn3c{ margin-left:440px;
} .g-bd3 p{ height:150px; background-color: pink; padding: 5px;
}

目前为止, 关于布局的NEC了解完毕.

我觉得对于自己组织html和CSS的确有帮助, 同时对于自己的编码也有一定启发. 

希望能小中见大, 触类旁通, 达到运用的目的.