CODEWITHSUNDEEP
htmlcssstylesheet
awongCM
awongCM

Reputation: 927

How to properly display html encoded Chinese Characters horizontally on web page?

I having trouble to display chinese characters in a horizontal format. I tried a few combinations using this css stylesheets.

My CSS:

.myborder{
    border: 2px solid;border-top-left-radius: 50px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 2px;
    box-shadow: 9px 9px 15px #000000;
}

.myborder .h1{
    width: 30px;
    display: compact;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    text-align: left;
    padding-left: 20px;
    font-size: 38.5px;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 0;
    line-height: 1;
    word-spacing: -1;
    font-family: inherit;
    color: inherit;
    text-rendering: optimizelegibility;
}

My html code:

<div class = "myborder">
   <div class="h1">国务院公布了房</div>
</div>

I have tried changing the display styles, line-height, word-spacing, etc. I still couldn't get it the characters printed out horizontally

Why is that?

Upvotes: 0

Views: 1822

Answers (1)

Matt
Matt

Reputation: 6953

It's because you are creating a div only 30px wide. SO the text has no choice but to go to the next line. Remove "width: 30px". I just tried that and it was fine.

Upvotes: 2

Related Questions