設定マージンに基づいた携帯電話のスケールピッカー

Question

2つの日付ピッカーの周りに一定のマージンが必要です。私は画面の幅に応じて日付ピッカーを水平にスケーリングする必要があります。ダッシュは常にコンテナの中央にある必要があります。私はパーセンテージを使って解決しようとしましたが、マージンを設定する方法もわかりません。どちらの日付選択も均等にスキャンし、常に同じサイズにする必要があります。誰もこれをきちんと解決する方法について考えていますか？

Answer 1

display: flexあなたが求めているが、ここで別のアプローチがhttps://jsfiddle.net/sxh0n7d1/6/

またはこれが何であるかを伝えるためにフィドルhttps://jsfiddle.net/sxh0n7d1/5/

ハードを参照して、このために動作します：https://jsfiddle.net/sxh0n7d1/7/

1を選びます私はそれがどのように行われたのか説明します。

サンプルHTML

<div class="wrapper"> 
    <div class="div1"> 

    </div> 
    <div class="line"> 

    </div> 
    <div class="div2"> 

    </div> 
</div> 

サンプルCSS

.wrapper { 
    width: 100%; 
    height: 50px; 
    border-style: dotted; 
    display: flex; 
    justify-content: space-between; 
} 
.line { 
    width: calc(100% - 320px); 
    border-bottom: solid; 
    border-bottom-width: 1px; 
    margin-bottom: 25px; 
} 

.div1, 
.div2 { 
    width: 100px; 
    height: 40px; 
    border-style: solid; 
    border-color: red; 
    margin: 0 30px; 
}