54 lines
2.2 KiB
HTML
54 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<style>
|
|
.float { float: left; width: 25px; height: 30px; background-color: lightgreen; }
|
|
</style>
|
|
<table border>
|
|
<tr>
|
|
<td style="vertical-align: baseline; height: 400px;">
|
|
Lorem
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
ipsum <span style="font-size: 36px;">dolor</span>
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
<div>sit</div>
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
<div style="background-color: lightblue; width: 50px; height: 100px;">amet</div>
|
|
</td>
|
|
<td style="vertical-align: baseline; width: 60px;">
|
|
consec
|
|
<div style="width: 60px; height: 50px; position: absolute; top: 0; background-color: lightyellow;">P</div>
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
<table border style="-webkit-border-vertical-spacing: 10px;">
|
|
<tr>
|
|
<td style="padding-top: 5px; border-top: 10px solid blue; border-bottom: 5px solid blue; vertical-align: baseline;">tetuer<br>adipiscing.</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
<td style="vertical-align: baseline; width: 60px;">
|
|
<div style="width: 60px; height: 50px; position: absolute; background-color: lightyellow;">P</div>
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
<div style="background-color: lightpink; width: 50px; height: 100px;"></div>
|
|
</td>
|
|
<td style="vertical-align: baseline;">
|
|
<table border cellpadding="5">
|
|
<tr style="height: 80px;">
|
|
<td style="padding-top: 15px; border-top: 10px solid blue; border-bottom: 5px solid blue; vertical-align: bottom;"><div style="background-color: lightpink;">Lorem</div></td>
|
|
</tr>
|
|
<tr>
|
|
<td>ipsum</td>
|
|
</tr>
|
|
</table>
|
|
dolor sit<br>amet.
|
|
</td>
|
|
<td style="vertical-align: baseline; width: 60px;">
|
|
<div class="float">F1</div>
|
|
<div class="float">F2</div>
|
|
<div class="float">F3</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|