iPhoneX safari: border set 0.5px with center align, it appears incompleteCSS - Excess space on the rightCenter image using text-align center?GridView Lines Not Showing up in IEResponsive image align center bootstrap 3Bootstrap one-page layout viewport width unitsSafari 9 (in iOS9) ignores CSS settingsCSS position:fixed is working for the header but not for the footerTextarea too large for page?Invalid css style during zooming in calendarCenter aligning a single letter inside a div

How hard is it to sell a home which is currently mortgaged?

Most importants new papers in computational complexity

How was film developed in the late 1920s?

The difference between Rad1 and Rfd1

3D nonogram, beginner's edition

How fast can a ship with rotating habitats be accelerated?

I hit a pipe with a mower and now it won't turn

How exactly is a normal force exerted, at the molecular level?

How do researchers used to find articles before the Internet and the computer era?

What exactly is a fey/fiend/celestial spirit?

Why was Mal so quick to drop Bester in favour of Kaylee?

Spicket or spigot?

Most elegant way to write a one shot IF

Java Optional working of orElse is not as if else

Did Wakanda officially get the stuff out of Bucky's head?

Can you sign using a digital signature itself?

Generate and graph the Recamán Sequence

Loss of majority in Westminster

How can I convince my reader that I will not use a certain trope?

Plotting the gradient descent

Why do I need two parameters in an HTTP parameter pollution attack?

Can I travel from Germany to England alone as an unaccompanied minor?

How to expand abbrevs without hitting another extra key?

Can 'leave' mean 'forget'?



iPhoneX safari: border set 0.5px with center align, it appears incomplete


CSS - Excess space on the rightCenter image using text-align center?GridView Lines Not Showing up in IEResponsive image align center bootstrap 3Bootstrap one-page layout viewport width unitsSafari 9 (in iOS9) ignores CSS settingsCSS position:fixed is working for the header but not for the footerTextarea too large for page?Invalid css style during zooming in calendarCenter aligning a single letter inside a div






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;








0















The labels' border were set to 0.5px;
Under Safari, it shows up uncomplete. some with the left border disappear, some right border.



After testing, I find some regulation, only text in Chineese has no border.



Is it a bug of safari on iPhoneX ,and How can I fixed it? Thanks.






<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body
font-family: PingFangSC-Regular;

.normal-label
margin: 0 52px;
text-align: center;


.label-item
display: inline-block;
word-break: keep-all;
box-sizing: border-box;
padding: 0 20px;

border: 0.5px solid #ddd;
border-radius: 2px;
height: 56px;
text-align: center;
line-height: 56px;

margin-bottom: 16px;
margin-right: 16px;
background: #fff;
font-size: 24px;
color: #999999;

.label-item-first-active
background: rgba(137,159,188,0.2);
border-color: #899FBC;
color: #899FBC;
box-sizing: border-box;



</style>

</head>
<body>
<div class="normal-label">
<div class="label-item">NoZhcn</div>
<div class="label-item label-item-first-active">笃行</div>
<div class="label-item label-item-first-active">笃行</div>
<div class="label-item label-item-first-active">笃行</div>
<div class="label-item">笃行之</div>
<div class="label-item">笃行之</div>
<div class="label-item">Hello</div>
<div class="label-item">笃行天下</div>
<div class="label-item">笃行天下</div>
<div class="label-item">笃行天下</div>
<div class="label-item">World</div>
<div class="label-item label-item-first-active">a笃行a</div>
</div>
</body>
</html>





Snapshot under iPhoneX:
enter image description here










share|improve this question






























    0















    The labels' border were set to 0.5px;
    Under Safari, it shows up uncomplete. some with the left border disappear, some right border.



    After testing, I find some regulation, only text in Chineese has no border.



    Is it a bug of safari on iPhoneX ,and How can I fixed it? Thanks.






    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
    body
    font-family: PingFangSC-Regular;

    .normal-label
    margin: 0 52px;
    text-align: center;


    .label-item
    display: inline-block;
    word-break: keep-all;
    box-sizing: border-box;
    padding: 0 20px;

    border: 0.5px solid #ddd;
    border-radius: 2px;
    height: 56px;
    text-align: center;
    line-height: 56px;

    margin-bottom: 16px;
    margin-right: 16px;
    background: #fff;
    font-size: 24px;
    color: #999999;

    .label-item-first-active
    background: rgba(137,159,188,0.2);
    border-color: #899FBC;
    color: #899FBC;
    box-sizing: border-box;



    </style>

    </head>
    <body>
    <div class="normal-label">
    <div class="label-item">NoZhcn</div>
    <div class="label-item label-item-first-active">笃行</div>
    <div class="label-item label-item-first-active">笃行</div>
    <div class="label-item label-item-first-active">笃行</div>
    <div class="label-item">笃行之</div>
    <div class="label-item">笃行之</div>
    <div class="label-item">Hello</div>
    <div class="label-item">笃行天下</div>
    <div class="label-item">笃行天下</div>
    <div class="label-item">笃行天下</div>
    <div class="label-item">World</div>
    <div class="label-item label-item-first-active">a笃行a</div>
    </div>
    </body>
    </html>





    Snapshot under iPhoneX:
    enter image description here










    share|improve this question


























      0












      0








      0


      0






      The labels' border were set to 0.5px;
      Under Safari, it shows up uncomplete. some with the left border disappear, some right border.



      After testing, I find some regulation, only text in Chineese has no border.



      Is it a bug of safari on iPhoneX ,and How can I fixed it? Thanks.






      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="UTF-8">
      <meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <style>
      body
      font-family: PingFangSC-Regular;

      .normal-label
      margin: 0 52px;
      text-align: center;


      .label-item
      display: inline-block;
      word-break: keep-all;
      box-sizing: border-box;
      padding: 0 20px;

      border: 0.5px solid #ddd;
      border-radius: 2px;
      height: 56px;
      text-align: center;
      line-height: 56px;

      margin-bottom: 16px;
      margin-right: 16px;
      background: #fff;
      font-size: 24px;
      color: #999999;

      .label-item-first-active
      background: rgba(137,159,188,0.2);
      border-color: #899FBC;
      color: #899FBC;
      box-sizing: border-box;



      </style>

      </head>
      <body>
      <div class="normal-label">
      <div class="label-item">NoZhcn</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">Hello</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">World</div>
      <div class="label-item label-item-first-active">a笃行a</div>
      </div>
      </body>
      </html>





      Snapshot under iPhoneX:
      enter image description here










      share|improve this question
















      The labels' border were set to 0.5px;
      Under Safari, it shows up uncomplete. some with the left border disappear, some right border.



      After testing, I find some regulation, only text in Chineese has no border.



      Is it a bug of safari on iPhoneX ,and How can I fixed it? Thanks.






      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="UTF-8">
      <meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <style>
      body
      font-family: PingFangSC-Regular;

      .normal-label
      margin: 0 52px;
      text-align: center;


      .label-item
      display: inline-block;
      word-break: keep-all;
      box-sizing: border-box;
      padding: 0 20px;

      border: 0.5px solid #ddd;
      border-radius: 2px;
      height: 56px;
      text-align: center;
      line-height: 56px;

      margin-bottom: 16px;
      margin-right: 16px;
      background: #fff;
      font-size: 24px;
      color: #999999;

      .label-item-first-active
      background: rgba(137,159,188,0.2);
      border-color: #899FBC;
      color: #899FBC;
      box-sizing: border-box;



      </style>

      </head>
      <body>
      <div class="normal-label">
      <div class="label-item">NoZhcn</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">Hello</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">World</div>
      <div class="label-item label-item-first-active">a笃行a</div>
      </div>
      </body>
      </html>





      Snapshot under iPhoneX:
      enter image description here






      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="UTF-8">
      <meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <style>
      body
      font-family: PingFangSC-Regular;

      .normal-label
      margin: 0 52px;
      text-align: center;


      .label-item
      display: inline-block;
      word-break: keep-all;
      box-sizing: border-box;
      padding: 0 20px;

      border: 0.5px solid #ddd;
      border-radius: 2px;
      height: 56px;
      text-align: center;
      line-height: 56px;

      margin-bottom: 16px;
      margin-right: 16px;
      background: #fff;
      font-size: 24px;
      color: #999999;

      .label-item-first-active
      background: rgba(137,159,188,0.2);
      border-color: #899FBC;
      color: #899FBC;
      box-sizing: border-box;



      </style>

      </head>
      <body>
      <div class="normal-label">
      <div class="label-item">NoZhcn</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">Hello</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">World</div>
      <div class="label-item label-item-first-active">a笃行a</div>
      </div>
      </body>
      </html>





      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="UTF-8">
      <meta content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover" name="viewport">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <style>
      body
      font-family: PingFangSC-Regular;

      .normal-label
      margin: 0 52px;
      text-align: center;


      .label-item
      display: inline-block;
      word-break: keep-all;
      box-sizing: border-box;
      padding: 0 20px;

      border: 0.5px solid #ddd;
      border-radius: 2px;
      height: 56px;
      text-align: center;
      line-height: 56px;

      margin-bottom: 16px;
      margin-right: 16px;
      background: #fff;
      font-size: 24px;
      color: #999999;

      .label-item-first-active
      background: rgba(137,159,188,0.2);
      border-color: #899FBC;
      color: #899FBC;
      box-sizing: border-box;



      </style>

      </head>
      <body>
      <div class="normal-label">
      <div class="label-item">NoZhcn</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item label-item-first-active">笃行</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">笃行之</div>
      <div class="label-item">Hello</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">笃行天下</div>
      <div class="label-item">World</div>
      <div class="label-item label-item-first-active">a笃行a</div>
      </div>
      </body>
      </html>






      css iphone safari






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Mar 27 at 3:22







      duXing

















      asked Mar 25 at 12:30









      duXingduXing

      1,0961 gold badge8 silver badges17 bronze badges




      1,0961 gold badge8 silver badges17 bronze badges






















          0






          active

          oldest

          votes










          Your Answer






          StackExchange.ifUsing("editor", function ()
          StackExchange.using("externalEditor", function ()
          StackExchange.using("snippets", function ()
          StackExchange.snippets.init();
          );
          );
          , "code-snippets");

          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "1"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader:
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          ,
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













          draft saved

          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55337836%2fiphonex-safari-border-set-0-5px-with-center-align-it-appears-incomplete%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown

























          0






          active

          oldest

          votes








          0






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes




          Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.








          Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.




















          draft saved

          draft discarded
















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid …


          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.

          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55337836%2fiphonex-safari-border-set-0-5px-with-center-align-it-appears-incomplete%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          How to preserve electronics (computers, tablets and phones) for hundreds of years Announcing the arrival of Valued Associate #679: Cesar Manara Planned maintenance scheduled April 23, 2019 at 23:30 UTC (7:30pm US/Eastern) The network's official Twitter account is up and running again. What content…How might modern humans leave a message for 50,000 years?How would an aquatic race develop computers?How do we make computers care for human life?Keeping supplies for 1000 yearsWhat will cell phones become in 100 years?What body armor protects against a laser?Could a society attain 1800s technology if limited to using copper and bronze?Electricity power (magic) and electronicsScavenging metal resources in post-apocalypse after 100 yearsWhy would precursors create devices that can survive and still work after hundreds of years?

          155 수학 과학 기타 둘러보기 메뉴eh추가해eh문서를 완성해

          해남서초등학교 학교 연혁 학교 동문 외부 링크 둘러보기 메뉴북위 34° 34′ 21″ 동경 126° 35′ 50″ / 북위 34.5726385° 동경 126.5972670°  / 34.5726385; 126.5972670해남서초등학교eh