CSS BlueTrip / BluePrint Fluid / Percentages插件

Posted 2021-05-23

.container.fluid .span-1,
.container.fluid .span-2,
.container.fluid .span-3,
.container.fluid .span-4,
.container.fluid .span-6,
.container.fluid .span-8,
.container.fluid .span-12,
.container.fluid .span-16,
.container.fluid .span-16,
.container.fluid .span-18,
.container.fluid .span-24 {margin-right:1%; display:block; float:left;}

.container.fluid .span-1 {width:3.208%;}/* 1/24 */
.container.fluid .span-2 {width:7.41%;}/* 1/12 */
.container.fluid .span-3 {width:11.625%;}/* 1/8 */
.container.fluid .span-4 {width:15.833%;}/* 1/6 */
.container.fluid .span-5 {width:19.2%;}
.container.fluid .span-6 {width:24.24%;}/* 1/4  25%  */
.container.fluid .span-7 {width:28.458%;}
.container.fluid .span-8 {width:32.66%;}/* 1/3  33% */
.container.fluid .span-9 {width:36.875%;}/* 3/8 */
.container.fluid .span-10 {width:41.083%;}
.container.fluid .span-11 {width:45.291%;}
.container.fluid .span-12 {width:49.49%;}/* 1/2  50% */
.container.fluid .span-13 {width:53.708%;}
.container.fluid .span-14 {width:58.916%;}/* 7/12 */
.container.fluid .span-15 {width:62.125%;}
.container.fluid .span-16 {width:66.333%;}/* 2/3 */
.container.fluid .span-17 {width:70.541%;}
.container.fluid .span-18 {width:74.75%;}/* 3/4 */
.container.fluid .span-19 {width:78.958%}
.container.fluid .span-20 {width:83.166%;}/* 5/6 */
.container.fluid .span-21 {width:87.375%;}
.container.fluid .span-22 {width:91.583%;}
.container.fluid .span-23 {width:95.791%;}

.container.fluid .span-24 {width:99%; clear:both;}

.container.fluid .last {margin-right:0; }

.container.fluid .suffix-1 {padding-right:4.125%;}
.container.fluid .suffix-2 {padding-right:8.25%;}
.container.fluid .suffix-3 {padding-right:12.375%;}
.container.fluid .suffix-4 {padding-right:17.5%;}
.container.fluid .suffix-6 {padding-right:25.75%;}
.container.fluid .suffix-8 {padding-right:34%;}
.container.fluid .suffix-12 {padding-right:50.49%;}
.container.fluid .suffix-16 {padding-right:67%;}
.container.fluid .suffix-18 {padding-right:75.75%%;}

.container.fluid .prefix-1 {padding-left:4.125%;}
.container.fluid .prefix-2 {padding-left:8.25%;}
.container.fluid .prefix-3 {padding-left:13.375%;}
.container.fluid .prefix-4 {padding-left:17.5%;}/* 1/6 */
.container.fluid .prefix-6 {padding-left:25.75%;}
.container.fluid .prefix-8 {padding-left:34%;}
.container.fluid .prefix-12 {padding-left:50.49%;}
.container.fluid .prefix-16 {padding-left:67%;}
.container.fluid .prefix-18 {padding-left:75.75%;}
.container.fluid .prefix-22 {padding-left:92.75%;}