こんばんは、解決できないことがあり、質問させてください。
前提・実現したいこと
Bootstrapでモックアップを作成したのですが、これをWordPressで実現したい。
該当のソースコード
<div class="container"> <div class="row"> <div class="col-xl-3">Information</div> <div class="col-xl-9"> <div class="row"> <div class="col-xl-4">記事</div> <div class="col-xl-4">記事</div> <div class="col-xl-4">記事</div> </div> </div> </div> </div>
WordPress php
<div class="col-md-9"> <section id="card-section"> <div class="row no-gutters"> <?php if(have_posts()): while(have_posts()): the_post(); ?> <div class="col-md-4 row-eq-height"> <div class="card"> <div class="nopadding example"> <img src="<?php the_post_thumbnail( 'large' ); ?> <p>NEW!!</p></div> <div class="card-body"> <h3 class="card-title"><?php the_title(); ?></h3> <p class="card-text"> <?php if(mb_strlen($post->post_content,'UTF-8')>100){ $content= str_replace('\n', '', mb_substr(strip_tags($post-> post_content), 0, 100,'UTF-8')); echo $content.'……'; }else{ echo str_replace('\n', '', strip_tags($post->post_content)); } ?></p> <a href="<?php the_permalink(); ?>" class="btn btn-primary">Go somewhere</a> </div> </div> </div> <?php endwhile; endif; ?> </div> </section> </div>写真のようにBootstrapで書いたhtmlは記事部分が3カラム並ぶのですが、
Wordpressで書き出したサイトではカラム落ちしてしまいます。
試したこと
・タグ落ち
・WordPressのcssにメディアが切ってないか調べてみたのですが、該当しませんでした。
バージョン
Bootstrapは4.3.1
何卒、よろしくお願いいたします。
回答4件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/07/30 07:04