Get Taste Text auf eine Zeile

Mein Button Text erscheint in einer Zeile in Safari (auch nach dem ersten Klick) aber auf Google Chrome meine Schaltfläche wird in einer Zeile angezeigt, wenn Sie zuerst auf die Schaltfläche, aber wenn Sie durch mehr Beiträge gehen und über die Schaltfläche "Load more" kommt der Text wieder durcheinander. Dies passiert nur bei Google Chrome.Get Taste Text auf eine Zeile

, wenn Sie an die Last mehr Taste das erste Mal bekommen ..

, wenn Sie an die Last mehr Taste zum zweiten Mal ..

hier ist mein CSS bekommen. .. Ich habe versucht, in der Breite, obwohl es das Problem löst die Schaltfläche ist dann nicht zentriert

.elm-wrapper { 
 
margin: 1em auto; 
 
text-align: center; 
 
} 
 

 
.elm-button { 
 
-webkit-transition: all 0.15s ease; 
 
transition: all 0.15s ease; 
 
background-color: #ffffff; 
 
text-shadow: none; 
 
    box-shadow: none; 
 
    border: none; 
 
    padding-top: 45px; 
 
    padding-bottom: 25px; 
 
font-family: 'Montserrat', sans-serif; 
 
    text-transform: uppercase; 
 
    font-size: 19px; 
 
    color: #848484; 
 
    outline: none; 
 
} 
 

 
.elm-button.ajax-inactive { 
 
display: none;  
 
} 
 
.elm-button.is-loading .elm-button-text { 
 
\t display: none; 
 
} 
 

 
.elm-loading-anim { 
 
\t display: none; 
 
} 
 

 
.elm-button.is-loading .elm-loading-anim { 
 
display: block; 
 
} 
 

 

 
.elm-loading-icon { 
 
width: 1.5em; 
 
height: 1.5em; 
 
} 
 
.elm-button:not(.is-loading)::before { 
 
      content: "v"; 
 
    font-size:11px; 
 
    float: right; 
 
    margin: 6px 0 0 16px; 
 
    font-family: 'Days One', sans-serif; 
 
}

Quelle

2016-12-20 user6738171

Möchten Sie mit ausprobieren:

.btn { 
    white-space: nowrap; 
    text align: center; 
}

Während white-space: nowrap Kraft Text in Schaltfläche wickeln nie, und Sie können auch auf die Schaltfläche display als inline-block machen, so dass Sie es eine bestimmte Breite nicht geben.

Quelle

2016-12-20 19:49:01

Dies funktioniert, außer wenn Sie "mehr Posts laden" das zweite Mal, dass der Pfeil das letzte "s" in Posts überlappt. So macht es immer noch den Button in google chrome wackelig (das zweite Mal es erscheint) – user6738171

@ user6738171 Da das Problem über 'Revisited' ist, denke ich, können wir 'btn: besuchte {}', um seine CSS danach zu steuern wird besucht. Wenn das auch nicht funktioniert, empfehle ich Ihnen, Ihre CSSone um eins zu reduzieren. –

Sie können einfach nicht brechenden Platz ( ) zwischen Wörtern in Ihrem HTML verwenden. Es ist grob, funktioniert aber in jedem Browser. Auch besser, links und rechts Polster innerhalb der Taste zu setzen.

Quelle

2016-12-20 18:43:12

Get Taste Text auf eine Zeile

Antwort

Verwandte Themen