ワードプレスのテキストエリアの問題（モバイルにのみ影響します）

Question

私は携帯にのみ影響を与えるパディングの問題があります。

この問題の理由は、いくつかの方法が知られているが、どのようにコンピュータのプレビューに影響を与えずに問題を解決します。あなたはパディングの背後にある理由を理解することができますので、ここで

は疑わしい

.entry-content, 
.entry-summary { 
    margin-top: 20px; 
    max-width:1000px; 
    width: 100%; 
    float: none; /* i don't know if this affect any thing */ 
    **float: none!important;** 
    **padding-left:150px !important;**  
       } 

は、ここでは、デスクトップからプレビューです。

それは一般的な設定かそこらでそのパディングのように見えます。 問題を解決するために何ができるのですか？ パディングラインをより特定の機能に再割り当てしますか？ などです。

Answer 1

あなた自身が問題を特定したようです。パディングはモバイルページに適用されます。

メディアクエリを使用して、ユーザーがデスクトップで表示しているかどうかを調べる方法があります。彼がいる場合は、要素にパディングを追加します。

は、最初の要素

.entry-content, 
    .entry-summary { 
    margin-top: 20px; 
    max-width:1000px; 
    width: 100%; 
    float: none; /* i don't know if this affect any thing */ 
    **float: none!important;** 
    } 

の主なスタイリングから詰め物を削除し、あなたのスタイルシートに次のようなものを追加し、これは画面の幅がある場合にのみpadding-leftを適用している何

@media only screen and (min-width : 1224px) { 
    .entry-content, .entry-summary { 
    padding-left: 150px; 
} 

1224ピクセルよりも大きい（基本的にデスクトップなので）。

しかし、より良い解決策は、テキストを右に配置するために左パッドが不要になるように要素を変更することです。しかし、これはHTMLの問題で、私はあなたにこれを手伝うための十分な情報がありません。