56 lines
1.4 KiB
HTML
56 lines
1.4 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<title>Problem 2</title>
|
||
|
|
|
||
|
|
<link rel="stylesheet" type="text/css" href="./problem-2.css">
|
||
|
|
|
||
|
|
<meta charset="utf-8">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
|
||
|
|
<table>
|
||
|
|
<tr>
|
||
|
|
<th>Example HTML/CSS Structure</th>
|
||
|
|
<th>Structure</th>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Example 1</td>
|
||
|
|
<td id="example-1">
|
||
|
|
<div class="container">
|
||
|
|
HTML 1
|
||
|
|
<div class="yellow">
|
||
|
|
2 2
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<span class="dashed">
|
||
|
|
3 3 3
|
||
|
|
</span>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Example 2</td>
|
||
|
|
<td id="example-2">
|
||
|
|
<div class="container">
|
||
|
|
<div class="inner-container">
|
||
|
|
<span class="yellow">
|
||
|
|
4 4 4 4
|
||
|
|
</span><!--
|
||
|
|
Comment to avoid adding an extra space here
|
||
|
|
--><span class="no-left-padding">
|
||
|
|
5 5 5 5 5
|
||
|
|
</span>
|
||
|
|
<div class="middle">
|
||
|
|
6 6 6 6 6 6
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|