Css's problem about Vertical layout

demand:

5
6
CSS

Note:

1
2IE9flex

Javascript css html css3 html5

Mar.28,2021

writing-mode learn about

<!DOCTYPE html>
<html>

<head>
    <style>
        -sharpmainBox {
            border: 1px -sharpf00 solid;
            width: 300px;
            height: 250px;
            writing-mode: tb-lr;/*IE*/
            writing-mode: vertical-lr;
        }

        -sharpmainBox a {
            margin: 5px;
            padding: 0px;
            display: inline-block;
            width: 30px;
            height: 30px;
            border: 1px -sharp00f solid;
            writing-mode: lr-tb;
        }
    </style>
</head>

<body>
    <div id="mainBox">
        <a href="-sharp">1</a>
        <a href="-sharp">2</a>
        <a href="-sharp">3</a>
        <a href="-sharp">4</a>
        <a href="-sharp">5</a>
        <a href="-sharp">6</a>
        <a href="-sharp">7</a>
        <a href="-sharp">8</a>
        <a href="-sharp">9</a>
        <a href="-sharp">10</a>
    </div>
</body>

</html>

Previous: Element tree control empty-text is not easy to use

Next: How do you save large chunks of text with oracle?