JSFiddle - React, Tailwind, and code Playground

by Cao Hat

HTML

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Tạo độ rộng cho từng cột trong Table với thẻ colgroup</title>
	<link rel="stylesheet" href="">
</head>
<body>
	<table >
		<colgroup> <!-- Mang ý nghĩa định định dạng cho tr với độ rộng do col trong nó quy định -->
			<col width="5%" span="1"> <!-- Gía trị span mà thay bằng 2 là th ngay sau nó cũng cũng có giá trị là 5% -->
			<col width="10%" span="1">
			<col width="15%" span="1">
			<col width="20%" span="1">
			<col width=auto span="1">
			<col width="10%" span="1">
		</colgroup>
		<tr>
			<th>STT</th>
			<th>Họ và Tên</th>
			<th>Quê quán</th>
			<th>Trình độ</th>
			<th>Nơi công tác</th>
			<th>Nơi xin chuyển đến</th>

		</tr>
		<tr>
			<td>001</td>
			<td>Trần Thị Hương Linh</td>
			<td>Đội xx-HTX YY-Xã ZZ-huyện GG-tỉnh Pro-nước KK</td>
			<td>MasterX</td>
			<td>Đội xx2-HTX YY2-Xã ZZ2-huyện GG2-tỉnh Pro2-nước KK2</td>
			<td>Đội xx3-HTX YY3-Xã ZZ3-huyện GG3-tỉnh Pro3-nước KK3</td>
		</tr>
	</table>
</body>
</html>

CSS

table{
			width: 100%;  
		}
		table, th, td {
			border: 1px solid red;
			border-collapse: collapse;
			text-align: left;
		}
			.rong100{
		width: 100%;
	}
.cao50px{
	height: 500px;
}