难以获得全宽度显示

Question

我正在使用基于Joomla 2.5的英语 - 泰语网站。在隐藏菜单中有泰语菜单项。此菜单项已加星标，因此访问网站时，将显示泰语页面。还有一个类似的英文菜单项。可以通过按钮从另一个页面访问这两个页面。

从图像中可以看出，泰语页面显示全宽，而英文页面则没有。问题似乎取决于主演，因为将主演交换到英语菜单项会导致英文页面显示为全宽，而泰语页面缩小

我已经通过Joomla后端查看了为什么会发生这种情况的任何线索，但我无法看到。任何帮助将不胜感激。

EDIT  这是2页的标记和CSS的一部分

HTML - 泰语页面

    <div id="front_page">​ 
    <div><a href="/index.php/frontispiece" class="fp_btn"><span  id="btn_text">english</span></a></div>
      <div id="fp_container">
      <!--  flex container  -->
        <div id="fp_logo">
        <!-- first flex item containing the e2tw logo  -->
          <img class="fpm_image" src="/templates/beez_20/images/e2tw/e2tw_logo1.svg" />
          <p class="fp_content1">english2theworld</p>
          <p class="fp_content2">สำหรับผู้ที่ต้องการเรียนภาษาอังกฤษ</p>
          <div class="fp_login"> {loadmodule mod_login}</div>
        </div>  
        <div id="intro_container1">
          <div id="intro_outliner">     
            <div id="intro_item1" class="intro_items intro_item_1 intro_item_eng">
              <p id="intro_head1" class="intro_content fp_heading"><span class="intro_head_title">เชิญเข้าสู่  โปรแกรม&nbsp;&nbsp;<span class="e2tw_text">english2theworld</span></span></p>
              <ul class="fp_lists fa-ul icon-star">
                <li class="fp_list_text ">โปรแกรม english2theworld  เป็นการวางรากฐานด้วยการสอนภาษาอังกฤษด้วยการฝึกหัดที่นำสมัย</li>
                <li class="fp_list_text ">english2theworld  นำสมัยในด้านการสื่อสารด้วยเทคโนโลยีที่ช่วยให้นักเรียนเรียนรู้ในการพูด การอ่านและการเขียนภาษาอังกฤษเป็นไปได้โดยเห็นผลอย่างรวดเร็วและมีประสิทธิภาพ</li>
                </ul>            
           </div>          
    <!--  markup deleted here  similar to the abaove  --> 
         </div>
         </div>
      </div>
    </div>     

HTML - 英文页面

    <div id="front_page">​ 
        <div><a href="index.php/frontispiece-thai" class="fp_btn"><span id="btn_text">อังกฤษ</span></a></div>
          <div id="fp_container">
          <!--  flex container  -->
            <div id="fp_logo">
            <!-- first flex item containing the e2tw logo  -->
              <img class="fpm_image" src="/templates/beez_20/images/e2tw/e2tw_logo1.svg" />
              <p class="fp_content1">english2theworld</p>
              <p class="fp_content2">for all who want to learn English</p>
              <div class="fp_login"> {loadmodule mod_login}</div>
            </div>
            <div id="intro_container1">
              <div id="intro_outliner">
                <div id="intro_item1" class="intro_items intro_item_1 intro_item_eng">
                  <p id="intro_head1" class="intro_content fp_heading"><span class="intro_head_title">WELCOME T0&nbsp;&nbsp;<span class="e2tw_text">english2theworld</span></span></p>
                  <ul class="fp_lists fa-ul icon-star">
                    <li class="fp_list_text ">english2theworld is based on sound teaching practice</li>
                    <li class="fp_list_text ">english2theworld uses interactive web technology to help students learn to speak, read and write English as quickly and efficiently as possible</li>
                    </ul>            
        <!--  markup deleted here  similar to the abaove  --> 
             </div>
             </div>
          </div>
    </div>

CSS

    div#fp_container {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-content: stretch;
        align-items: flex-start;
        padding-bottom: 1%;
    }
    div#fp_logo {
        order: 0;
        flex: 1 1 auto;
        align-self: auto;
        width: 35%;
        border: 1px solid #000093;
        margin: 0 0 0 4%;
        background: #EFF1FF;
    }
    div#fp_logo img.fpm_image {
      width: 70%;
      height: auto;
      margin: auto auto;
      display: block;
      margin-top: 5%;
    }
    p.fp_content1, p.fp_content2   {
      font-family: 'Baumans', cursive;
      font-weight: 600;
      color: #000093;
      text-align: center;
    }
    p.fp_content1 {
      font-size: 1.9em;
      margin:  1%  0  1% 0;
    }
    p.fp_content2  {
       font-size: 1.4em;
      margin:  0  0 1% 0;
    }
    div.fp_login  {
      margin: 10% 2% 5% 2%;
    }
    div.fp_login fieldset.userdata ul {
      margin: 0;
    }
    div.fp_login li {
      font-size: 0.5em;
    }
    div#intro_container1 {
      flex: 2 1 auto;
      display: flex;
      flex-flow: column wrap;
    //  justify-content: flex-start;
    // align-content: center;
     //align-items: baseline;
    // margin: 2% 5% 5% 2%;
      width: 95%;
    }
    div.intro_outliner  {
      border: 1px solid #000093;
    }
    div#intro_item1, div#intro_item2, div#intro_item3,
    div#intro_item4, div#intro_item5  {
      order: 0;
       flex: 0 1 90%;
       width: 87%;
       margin: 0 0 2% 5%;
       background: #EFF1FF;
    }

我希望这会有所帮助。感谢您的关注。