2017-11-04 26 views
0

文書の中で正しい方向に向いているものは何も見つかりません。columnsを使用することは避けようとしています。ブートストラップ4応答性のある改行

echo date('l') . "<br>" . date('F d, Y');を使用して、私のサイトの上部に曜日の日付を表示しています。これは、このような日付が表示されますが、その中心に:それは改行なしFriday November 03, 2017として表示するために私が好きな小さな画面で

Friday November 03, 2017

電話機など。

私は私だけで簡単にこれを行うと、それを達成する可能性が知っているが、列もサイズがあるので、それは、単語の間のギャップを作成します。

<div class="row"> 
<div class="col-sm-6 col-md-12"> 
<?php echo date('l'); ?> 
</div> 
<div class="col-sm-6 col-md-12"> 
<?php echo date('F d, Y'); ?> 
</div> 

は、これを達成するための他の方法はありますか?

ギャップとは、Friday [gap here due to column space] November 03, 2017です。ここで

答えて

1

のためのソリューションです、しかし、私の暗示はこれです:日付間

、あなたがのdiv clearfixを設定することができ、このdivがMDのみですサイズのため、hidden-smやhidden-xsクラスを作成します。

<div class="row"> 
     <div class="col-sm-6 col-md-12"> 
     <?php echo date('l'); ?> 
     <div class="clearfix hidden-xs hidden-sm"> </div> 


    <?php echo date('F d, Y'); ?> 
     </div> 
    </div> 

正しいですか? clearfix divは、lgとmdのサイズでのみ日付を区切ります。

+1

うまくいきました。 'hidden-xs'と' hidden-sm'だけがブートストラップ4に存在するクラスではなくなりました。私は対応する新しいクラスを使用しましたが、それは魅力的でした。私が使ったクラスは 'display:none;'と 'd-none'でした。もう一つは' d-md-block'でした。これは中画面以上で表示されます。 –

+0

素晴らしい、男!ブートストラップはフロントエンドの開発者にとって非常に高速です。 –

+0

ああ、私は絶対にそれが大好きです。それは非常に簡単に開発することができます。 –

0

が、私はこの質問を見たことがない、あなたの質問

<div class="row"> 
    <div class="col-md-6 col-sm-12"> 
    <div class="row"> 
    <?php echo date('l'); ?> 
    </div> 
    </div> 
    <div class="col-md-6 col-sm-12"> 
    <div class="row"> 
    <?php echo date('F d, Y'); ?> 
    </div> 
    </div> 
関連する問題