Sideway

output.to from Sideway

`-=[]⟨⟩\;',./~!@#$%^&*()_+{}|:"<>? 𝑎𝑏𝑐𝑑𝑒𝑓𝑔ℎ𝑖𝑗𝑘𝑙𝑚𝑛𝑜𝑝𝑞𝑟𝑠𝑡𝑢𝑣𝑤𝑥𝑦𝑧 Å − × ⋅∓±∘꞊﹦∗∙ ℯ 𝔸𝔹ℂ𝔻𝔼𝔽𝔾ℍ𝕀𝕁𝕂𝕃𝕄ℕ𝕆ℙℚℝ𝕊𝕋𝕌𝕍𝕎𝕏𝕐ℤ𝐴𝐵𝐶𝐷𝐸𝐹𝐺𝐻𝐼𝐽𝐾𝐿𝑀𝑁𝑂𝑃𝑄𝑅𝑆𝑇𝑈𝑉𝑊𝑋𝑌𝑍 ∼∽∾≁≂≃≄≅≆≇≈≉≌≐≠≡ ≤≥≦≧≨≩≪≫ ∈∉∊∋∌∍ ⊂⊃⊄⊅⊆⊇ 𝛼𝛽𝛾𝛿𝜀𝜁𝜂𝜃𝜄𝜅𝜆𝜇𝜈𝜉𝜊𝜋𝜌𝜎𝜏𝜐𝜑𝜒𝜓𝜔 ∀∂∃∅⦰∆∇∎∞∝∴∵ ∏∐∑⋀⋁⋂⋃ ∧∨∩∪ ∫∬∭∮∯∰∱∲∳ ∥⋮⋯⋰⋱ ‖ ′ ″ ‴ ⁄ ⁗ ʹ ʺ ‵ ‶ ‷ ﹁﹂﹃﹄︹︺︻︼ ︗ ︘ ︿﹀︽︾﹇﹈︷︸ ⏜ ⏝ ⎴ ⎵ ⏞ ⏟ ⏠ ⏡ ←↑→↓↤↦↥↧↔↕↖↗↘↙▲▼◀▶↺↻⟲⟳ ↼↽↾↿⇀⇁⇂⇃⇄⇅⇆⇇ ⇐⇑⇒⇓⇔⇌⇍⇏⇕⇖⇗⇘⇙⇙⇳⥢⥣⥤⥥⥦⥧⥨⥩⥪⥫⥬⥭⥮⥯

Draft for Information Only

Content

CSS Table Object
 HTML Table Object Tag
  CSS Table Objects
   Table-cell Object
   Table-cell Objects
   Empty Table-Row Object
   Table-Row Objects
   Table-caption Objects

CSS Table Object

Since display property can be assign to any HTML tag, tagged elements other than HTML table object tags can also be used to construct CSS table objects. .

HTML Table Object Tag

In HTML, a HTML table is usually rendered according to the HTML table tag elements because these tagged elements are well defined by default. User agents may ignore the 'display' property of a HTML table tag element if the HTML table is constructed by HTML table tag elements correctly. However, user agents will always take the 'display' property of other non-table tag elements as usual when rendering a HTML tagged element. In other words, other HTML tagged element can also be rendered a table objects when altering the 'display' properties of tagged element accordingly.

The relationships between 'display' property and HTML table tag are

'display' inline-table: not defined in HTML and is used to specify an inline level table element
'display' table: 'table' in HTML and is used to specify a block level table element
'display' table-caption: 'caption' in HTML and is used to specify a table caption element
'display' table-column-group: 'colgroup' in HTML and is used to specify a group of one or more columns of table cells element
'display' table-column: 'col' in HTML and is a tagged element used to specify the properties of a column of table cesll
'display' table-header-group: 'thead' in HTML and is used to specify a row of table cells element with the table header function
'display' table-footer-group: 'tfoot' in HTML and is used to specify a row of table cells element with the table footer function
'display' table-row-group: 'tbody' in HTML and is used to specify a group of one or more rows of table cells element
'display' table-row: 'tr' in HTML and is used to specify a row of table cells element.
'display' table-cell: 'td' in HTML and is used to specify a table data cell element

CSS Table Objects

CSS table objects are created by assigning those values of table construction related to the 'display' property. One typical example of using HTML tag for creating CSS table objectis is to modify the 'display' propertiey of '<b>', '<i>', and '<u>' tags. But the 'font-style', 'font-weight', and 'text-decoration:none' properties must be normalized accordingly. For examples,

Table-cell Object

Create a table cell with bold 'font-weight' property and use the table cell as a block

HTML Document Input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<style type="text/css">
div,p,b {font-size:1em}
div {width:500px;background-color:cyan}
p {width:auto;background-color:lime;margin:0em 2em}
b {display:table-cell;background-color:silver;padding:0em 0.25em}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
<p>This is "<b>a 'b' table cell</b>".</p>
</div>
    </body>
</html>

HTML Web Page Embedded Output:

Table-cell Objects

Create table cells with bold 'font-weight' property. When two sibling table cells are consecutive and with inline containing only white space, these two table cells will be tabulated as in a table.

HTML Document Input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<style type="text/css">
div,b {font-size:1em}
div {width:500px;background-color:cyan}
p {width:60px;background-color:lime;margin:0em 2em}
b {display:table-cell;background-color:silver;padding:0em 0.25em}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
<p>This is "<b>a 'b' table cell</b>".
This is "<b>another 'b' table cell</b>
<b>another next 'b' table cell</b>".</p>
</div>
    </body>
</html>

HTML Web Page Embedded Output:

Empty Table-Row Object

Create empty table row objects and use the table rows as blocks only

HTML Document Input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<style type="text/css">
div,b {font-size:1em}
div {width:500px;background-color:cyan}
p {width:auto;background-color:lime;margin:0em 2em}
u {display:table-row;text-decoration:none;background-color:yellow;padding:0em 0.25em}
b {display:table-cell;background-color:silver;padding:0em 0.25em}
</style>
<title>Sample Page</title>
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
<p>This is "<u>a 'u' table row</u>".</p>
<p><b>This is "<u>a 'u' table row</u>"nested in a "b" table cell.</b>
<b>This is "<u>a 'u' table row</u>"bounded by another "b" sibling table cell .</b></p>
</div>
    </body>
</html>

HTML Web Page Embedded Output:

Table-Row Objects

Create table row objects with or without table cell. When two or more sibling table rows are consecutive and with inline containing only white space, these consecutive table rows will be tabulated as in a table.

HTML Document Input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<style type="text/css">
div,b {font-size:1em}
div {width:500px;background-color:cyan}
p {width:auto;background-color:lime;margin:0em 2em}
u {display:table-row;text-decoration:none;background-color:yellow;padding:0em 0.25em}
b {display:table-cell;background-color:silver;padding:0em 0.25em}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
<p>This is "<u>a 'u' table row with <b>a "b" table cell</b>nested</u>".</p>
<p>This is "<u>a 'u' table row with <b>a "b" table cell</b><b>next "b" table cell</b>nested</u>
<u>another empty 'u' table row</u>
<u>another next 'u' table row with <b>another "b" table cell</b><b>another next "b" table cell</b>nested</u></p>
</div>
    </body>
</html>

HTML Web Page Embedded Output:

Table-caption Objects

Create table captions. A table caption outside a table is used as a block. When two or more sibling table captions are consecutive and with inline containing only white space, these consecutive table captions will always be ignorted. A table caption nested in a table will be relocated as a caption outside the table. However the rendering of the caption is always affected by the tag container.

HTML Document Input:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<style type="text/css">
div,p,b {font-size:1em}
div {width:500px;background-color:cyan}
p {width:auto;background-color:lime;margin:0em 2em}
b {display:table-cell;background-color:silver;padding:0em 0.25em}
i {display:table-caption;background-color:gray;padding:0em 0.25em}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
<p>This is a "p" paragraph.</p>
<p style="display:table-caption">This is a "p" paragraph with table caption 'display' property.</p>
<i>This is a "i" tag with table caption 'display' property.</i>
<p>This is <i>a "i" tag with table caption 'display' property </i>nested in a "p" paragraph.</p>
<p style="display:table">This is a "p" tag table used to nest a table caption {-- <i>This is a "i" tag with table caption 'display' property nested in a 'p' tag table</i> <i>This is another "i" tag with table caption 'display' property</i> --} witho no table row or tabale cell.</p>
</div>
    </body>
</html>

HTML Web Page Embedded Output:

©sideway

ID: 180300001 Last Updated: 3/1/2018 Revision: 0 Ref:

References

http://www.w3.org/TR/1999/REC-html401-1999, 1999, HTML 4.01 Specification: W3C Recommendation, updated 24 December 1999

Latest Updated Links

Travel Singapore Sight Central(last updated On 1/8/2026)
Panasonic HHGTQ1001B13 LED Floor Light(last updated On 1/7/2026)
Travel Singapore Sight West | Central(last updated On 1/6/2026)
Travel Singapore Sight Sentosa Sensoryscape(last updated On 1/5/2026)
Travel Singapore Sight Sentosa Resorts World Sentosa(last updated On 1/4/2026)
Travel Singapore Sight Sentosa HarbourFront(last updated On 1/3/2026)
Travel Singapore Sight Sentosa(last updated On 1/2/2026)
Travel Singapore Sight Bird Paradise(last updated On 12/30/2025)
Travel Singapore Sight Mandai(last updated On 12/30/2025)
Travel Singapore Sight Singapore Zoo(last updated On 12/30/2025)
Travel Singapore Sight Rainforest Wild ASIA(last updated On 12/30/2025)

Valid XHTML 1.0 Transitional

Valid CSS!

Nu Html Checker

Chrome

IExplorer

Business

Management

HBR₃

Information

Recreation

Culture

Chinese₁₀₉₇

English₃₃₉

Travel₃₈

Reference₇₉

Computer

Hardware₂₅₉

Software

Application₂₁₃

Digitization₃₇

Latex₅₂

Manim₂₀₅

KB₁

Programming

Web₂₉₀ new

Unicode₅₀₄

HTML₆₆ new

Common Color₁ new

Html Entity (Unicode)₁ new

Html 401 Special₁

CSS₆₅ new

SVG₄₆

ASP.NET₂₇₀

OS₄₄₇ new

MS Windows

Windows10₁ new

.NET Framework₁

Python₇₂

Knowledge

Mathematics

Set₁

Number Theory₂₀₇ new

Trigonometry₃₁

Coordinate Geometry₂

Complex Analysis₂₁

Engineering

Mechanical

Rigid Bodies

Fluid Kinematics₅

Control

Process Control₁

Acoustics₁₉

FiniteElement₂

Natural Sciences

Copyright © 2000-2026 Sideway . All rights reserved Disclaimers last modified on 06 September 2019