Topic: Windows 7, Internet Explorer 11 Flexbox Issue

Paul King pro asked 5 years ago


Hi, I am having an issue specifically within Windows 7, Internet Explorer 11 wherein the flexbox content within my hero section of the site seems to shift to the right side of the screen. Example here - http://awre.com.au/home-2/ If I remove the surrounding 'container' class it centres but I obviously don't want to remove this as it expands the flexbox area and doesn't look as good. Any ideas on the issue? Thanks Paul

Paul King pro answered 5 years ago


Perfect Thanks - that seems to have resolved the issue!

Rafał Rogulski free answered 5 years ago


Hi Paul, I find the way to fix this. In your CSS style file add:
.ml-0 {
   margin-left: 0 !important;
}
.mr-0 {
   margin-left: 0 !important;
}
Next, in your HTML file, find:
      <div class="container">
          <ul class="animated fadeIn offset-md-1 col-md-10">
              <li>
                  <h1 class="h1-responsive">The Australasian Waste & Recycling Expo is back in Melbourne in 2017!</h1></li>
              <li>
                  <p>The Australasian Waste & Recycling Expo (AWRE) is the most established commercial event dedicated to the Australasian waste 
                     and recycling marketplace.</p>
                  <p>The event brings together the industry to discover the latest trends, showcase innovation, network with key waste and 
                     recycling decision makers from industry and government and attend high quality practical seminars and workshops.</p>
              </li>
              <li>
                  <a target="_blank" href="http://awre.com.au/about/" class="btn btn-hero btn-lg waves-effect waves-light" rel="nofollow" style="
                      padding: 12px;
                      font-size: 16px;
                  ">Find out more</a>
              </li>
          </ul>
        </div>
and in .container add this class

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags