Div не выровнен только для IE

0

У меня есть простой статический сайт на одной странице с контейнером контейнера bootstrap, который обертывает 4 других div.

элемент класса "intro-box" должен быть центрирован. он идеально сосредоточен в firefox и chrome. Однако IE11 позиционирует его в крайнем левом углу контейнера div. Ive включил html и css. любая помощь очень ценится.

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= content_for?(:title) ? yield(:title) : "my_title" %></title>
<meta name="description" content="<%= content_for?(:description) ? yield(:description) : "my_description" %>">

<%= stylesheet_link_tag "application", :media => "all" %>
 <%= favicon_link_tag "/favicon.ico" %>
<%= csrf_meta_tags %>
<%= yield(:head) %>
</head>
<body class="<%= controller_name %> <%= action_name %>">
<div class="background">
<%=image_tag("bkgrnd.jpg", :class=>"background-img")%> 
</div>
  <div class="container">   
    <div class="center-div">
<div class="social">
     some social networking stuff
    <div class="email-capture">
   some fields to capture users emails
    </div>
     <p class="intro-box"> some introductory stuff </p> 
    </div>
  <div class="opaque-block"> some stuff</div> 
     </div>      
  </div> 

CSS

 .intro-box{
  left: 0; right: 0;
  position:absolute;
   top:185px;
   display:block;
  margin:auto;
  font-family: "abeatbyKai", sans-serif;
  color:#000;
  max-width:180px;
 height:90px;
  padding:10px;
 }
  • 1
    Вы пытались удалить положение: абсолютное и левое: 0, правое: 0? это должно центрировать это без тех.
  • 0
    не могу поверить, что это было так просто, но это сработало. Я должен был установить свою позицию относительно. Не уверен, почему это было бы на Chrome и Firefox, но все равно спасибо. Если вы отправите свой ответ как неправильный ответ, отметьте его как правильный.
Теги:
internet-explorer

3 ответа

0
Лучший ответ

Удалено слева: 0, справа: 0 и установите положение относительно абсолютного.

0

В дополнение к удалению левого, правого и абсолютного положения, указанного в JanR, добавьте маржу как

margin: 0 auto;

если вам не нужен верхний, нижний край и сделать его равномерным в браузерах, так как вы указали максимальную ширину, маржа автоматически выровнят ее по центру, или для IE вы можете просто удалить

position: absolute

я попробовал его работу

0

Попробуйте это... вам может понадобиться отрегулировать маржу по 185px в соответствии с вашими потребностями.

.intro-box{
   margin:185px auto 0 auto;
   display:block;
  margin:0 auto;
  font-family: "abeatbyKai", sans-serif;
  color:#000;
  max-width:180px;
  height:90px;
  padding:10px;
 }

Ещё вопросы

Сообщество Overcoder
Наверх
Меню