Kuunganisha Safu wima kwenye Gridi za CSS
Vivyo hivyo unaweza kuunganisha
safu wima kwa kutumia sifa
grid-column.
Tuchukulie tuna gridi lenye vipengele vinne. Sasa tufanye ili kipengele cha kwanza, cha pili na cha tatu kiwe katika safu mlalo ya kwanza. Na kipengele cha nne kichukue safu mlalo yote ya pili:
<div id="parent">
<div id="elem1">1</div>
<div id="elem2">2</div>
<div id="elem3">3</div>
<div id="elem4">4</div>
</div>
#parent {
display: grid;
padding: 10px;
border: 2px solid #696989;
width: 400px;
height: 300px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
#elem1 {
grid-column: 1 / 2;
}
#elem2 {
grid-column: 2 / 3;
}
#elem3 {
grid-column: 3 / 4;
}
#elem4 {
grid-column: 1 / 4;
}
:
Weka vipengele vyote na unganisha safu wima kulingana na mfano ufuatao:
Weka vipengele vyote na unganisha safu wima kulingana na mfano ufuatao:
Weka vipengele vyote na unganisha safu wima kulingana na mfano ufuatao:
