-
FEATURED COMPONENTS
First time here? Check out the FAQ!
1 | initial version | |
How to customize grid columns width using only .css
<zk> <style> .column1 { width: 10em; } .column2 { width: 15em; } .column3 { width: 20em; } </style>
<grid sclass="whole_table">
<auxhead>
<auxheader sclass="column1"/>
<auxheader sclass="column2"><textbox value="" width="90%"/></auxheader>
<auxheader sclass="column3"><textbox value="" width="90%"/></auxheader>
</auxhead>
<columns sizable="true" menupopup="auto">
<column sclass="column1" label="column1" />
<column sclass="column2" label="column2" />
<column sclass="column3" label="column3" />
</columns>
<rows>
<row forEach="1,2,3">
<label value="111111111111111" sclass="column1"/>
<label value="222222222222222" sclass="column2"/>
<label value="333333333333333" sclass="column3"/>
</row>
</rows>
</grid>
</zk>
://s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want: - Customize grid column widths using only css (without need to set up width in program code with tag: width="10em"). - link for css designers to design grid columns with css classes
2 | No.2 Revision |
How to customize grid columns width using only .css
<zk> <style> .column1 { width: 10em; } .column2 { width: 15em; } .column3 { width: 20em; } </style>
<grid sclass="whole_table">
<auxhead>
<auxheader sclass="column1"/>
<auxheader sclass="column2"><textbox value="" width="90%"/></auxheader>
<auxheader sclass="column3"><textbox value="" width="90%"/></auxheader>
</auxhead>
<columns sizable="true" menupopup="auto">
<column sclass="column1" label="column1" />
<column sclass="column2" label="column2" />
<column sclass="column3" label="column3" />
</columns>
<rows>
<row forEach="1,2,3">
<label value="111111111111111" sclass="column1"/>
<label value="222222222222222" sclass="column2"/>
<label value="333333333333333" sclass="column3"/>
</row>
</rows>
</grid>
</zk>
://s8.postimg.org/52q6vlu1x/customizehttp:// s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want:
- Customize grid column widths using only css (without need to set up width in program code with tag: width="10em").
- link for css designers to design grid columns with css classeswidth="10em")
3 | No.3 Revision |
How to customize grid columns width using only .css
<?page id="layout" docType="html" contentType="text/html;charset=UTF-8" title="how to customize grid column widths with css" ?>
<zk>
http:// s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want:
- Customize grid column widths using only only css (without need needs to set up width in program code with tag: width="10em")
4 | No.4 Revision |
How to customize grid columns width using only .css
<?page id="layout" docType="html" contentType="text/html;charset=UTF-8" title="how to customize grid column widths with css" ?>
<zk>
<style>
.column1 { width: 10em; }
.column2 { width: 15em; }
.column3 { width: 20em; }
</style>
<grid sclass="whole_table">
<auxhead>
<auxheader sclass="column1"/>
<auxheader sclass="column2"><textbox value="" width="90%"/></auxheader>
<auxheader sclass="column3"><textbox value="" width="90%"/></auxheader>
</auxhead>
<columns sizable="true" menupopup="auto">
<column sclass="column1" label="column1" />
<column sclass="column2" label="column2" />
<column sclass="column3" label="column3" />
</columns>
<rows>
<row forEach="1,2,3">
<label value="111111111111111" sclass="column1"/>
<label value="222222222222222" sclass="column2"/>
<label value="333333333333333" sclass="column3"/>
</row>
</rows>
</grid>
</zk>
http:// s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want:
- Customize grid column widths using only only css (without needs need to set up width in program code with tag: width="10em")
5 | No.5 Revision |
How to customize grid columns width using only .css
<?page id="layout" docType="html" contentType="text/html;charset=UTF-8" title="how to customize grid column widths with css" ?>
<zk>
<style>
.column1 { width: 10em; }
.column2 { width: 15em; }
.column3 { width: 20em; }
</style>
<grid sclass="whole_table">
<auxhead>
<auxheader sclass="column1"/>
<auxheader sclass="column2"><textbox value="" width="90%"/></auxheader>
<auxheader sclass="column3"><textbox value="" width="90%"/></auxheader>
</auxhead>
<columns sizable="true" menupopup="auto">
<column sclass="column1" label="column1" />
<column sclass="column2" label="column2" />
<column sclass="column3" label="column3" />
</columns>
<rows>
<row forEach="1,2,3">
<label value="111111111111111" sclass="column1"/>
<label value="222222222222222" sclass="column2"/>
<label value="333333333333333" sclass="column3"/>
</row>
</rows>
</grid>
</zk>
screenshot:
http:// s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want:
- Customize grid column widths using only css (without need to set up width in program code with tag: width="10em")
6 | No.6 Revision |
How to customize grid columns width using only .css
<?page id="layout" docType="html" contentType="text/html;charset=UTF-8" title="how to customize grid column widths with css" ?>
<zk>
<style>
.column1 { width: 10em; }
.column2 { width: 15em; }
.column3 { width: 20em; }
</style>
<grid sclass="whole_table">
<auxhead>
<auxheader sclass="column1"/>
<auxheader sclass="column2"><textbox value="" width="90%"/></auxheader>
<auxheader sclass="column3"><textbox value="" width="90%"/></auxheader>
</auxhead>
<columns sizable="true" menupopup="auto">
<column sclass="column1" label="column1" />
<column sclass="column2" label="column2" />
<column sclass="column3" label="column3" />
</columns>
<rows>
<row forEach="1,2,3">
<label value="111111111111111" sclass="column1"/>
<label value="222222222222222" sclass="column2"/>
<label value="333333333333333" sclass="column3"/>
</row>
</rows>
</grid>
</zk>
screenshot:Screenshot:
http:// s8.postimg.org/52q6vlu1x/customizecolumnwidthwithcss.png
Want:
- Customize grid column widths using only css (without need to set up width in program code with tag: width="10em")