Pitäisi kuvanmukainen sivu luoda, mutta en nyt hoksaa miten sen saisi tehtyä.
1 +---+ 2 | | 3 | | 4 +---+ 5 6 7 8
Eli vasemmalla 5 kpl 1x1 laatikoita, oikealla ylhäällä 3x4 laatikko ja sen alla 3 kpl 1x1 laatikoita.
Miten mahdollista Boostrapilla tai html taulukolla?
Käytä attripuutteja colspan ja rowspan.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<style>
td{
border: 1px solid black;
width: 150px;
}
</style>
</head>
<body>
<table>
<tr>
<td></td>
<td colspan="3" rowspan="4"></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>Pääsisiköhän tästä alkuun ?
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi" lang="fi" >
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /><html>
<style>
table {
border:none;
}
td {
border-radius: 10px;
}
</style>
</head>
<body>
<table border="1">
<tr><td >???</td><td colspan="3" rowspan="4" >ok </td></tr>
<tr><td >???</td></tr>
<tr><td >???</td></tr>
<tr><td >???</td></tr>
<tr><td >???</td><td>???</td><td>???</td><td>???</td></tr>
</table>
</body>
</html>Jaahas... dartvaneri kerkesi ennen, no on tässä minun esimerkissä border-radius.
Aihe on jo aika vanha, joten et voi enää vastata siihen.