Moodleのブートストラップテーブル

Question

こんにちは、私は現在クライアントのMoodleサイトで作業しています。私たちは、ホームランディングページで反応の良いテーブルを取得しようとしています。他のMoodleライブラリと衝突するので、Bootstrapフレームワーク全体をサイトにコピーすることができませんでした。ブートストラップCSSから.containerから始めて、テーブル要素をコピーして貼り付けて、それをMoodleのカスタムCSSスペースに追加しました。私は、次を追加しました：

<div class="container"> 
    <div class="col-12 col-sm-12 col-lg-12"> 
     <div class="table-responsive"> 
       <table class="table"> 
        <tbody> 
          <tr> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
            <a href="http://moodle.ranzco.edu/course/view.php?id=98" class="nounderlineyellow"><i class="fa fa-medkit" aria-hidden="true"></i></a><span style="font-size: x-large;"><br />Trainees</span> 
           </td> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
             <p><a href="http://moodle.ranzco.edu/course/view.php?id=102" class="nounderlineyellow"><i class="fa fa-user-md" aria-hidden="true"></i></a><br /><span style="font-size: x-large;">Term Supervisors Clinical Tutors</span></p> 
           </td> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
             <a href="http://moodle.ranzco.edu/course/view.php?id=101" class="nounderlineyellow"><i class="fa fa-graduation-cap" aria-hidden="true"></i></a><br /><span style="font-size: x-large;">Examiners</span> 
           </td> 
          </tr> 
          <tr> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
             <a href="http://moodle.ranzco.edu/course/view.php?id=97" class="nounderlineyellow"><i class="fa fa-eye" aria-hidden="true"></i></a><br /><span style="font-size: x-large;">Mentors</span> 
           </td> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
             <a href="http://moodle.ranzco.edu/course/view.php?id=100" class="nounderlineyellow"><i class="fa fa-users" aria-hidden="true"></i></a><br /><span style="font-size: x-large;">Fellows</span> 
           </td> 
           <td class="fhcell hvr-shutter-in-horizontal" style="text-align: center;"> 
             <a href="http://moodle.ranzco.edu/course/view.php?id=99" class="nounderlineyellow"><i class="fa fa-globe" aria-hidden="true"></i></a><br /><span style="font-size: x-large;">International Medical Graduates</span> 
           </td> 
          </tr> 
        </tbody> 
       </table> 
     </div> 
    </div> 

しかし、それは働いていません。どんな助けでも本当に感謝しています。サイトのURLはMoodle Site

Answer 1

2行目<div class="col-12 col-sm-12 col-lg-12">は<div class="col-md-12 col-sm-12 col-lg-12">にする必要があります。ブートストラップにcol-12はありません。

また、最初にtry hereブートストラップテーブルを使用できます。