2014-02-06 1 views
0

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

Я ввел этот код в jsfiddle, и он выглядит хорошо, но он на лобке на моем сайте.

У кого-нибудь есть представление о том, что мне не хватает?

вот HTML:

 <div class="terms">  
     <div id="c1"> 
     <h3>This is the left side</h3> 
<p>&nbsp;</p> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
     </div> 
     <div id="c2"> 
     <h3>This is the right side</h3> 
      <p>&nbsp;</p> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
     </div> 
     </div>    

</div>  
</div> 
</div> 
</div> 
</div> 

И вот CSS:

.terms { 
    margin-top: 25px; 
    clear:both; 
    width: 100%; 
    display:table; 
    border-spacing: 35px 75px 35px 75px; 
} 

#c1, #c2, #c3 { 
    display:table-cell; 
    font-family:'Lato', Arial, Helvetica, sans-serif; 
    color: #787878; 
    line-height: 25px; 
    letter-spacing: 1px; 
} 

#c1, #c2, #c3 h3 { 
    padding: 20px 20px 20px 20px; 
    font-family: Lato, Arial, Helvetica, sans-serif; 
    font-size: 15px; 
} 

p { 
    color: #828282; 
    font-family: Lato, Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    line-height: 18px; 
    text-align: justify; 
} 
+0

Кстати, я пробовал firefox, chrome и safari с одинаковыми результатами. –

ответ

1

больше комментариев, чем ответ, но увы, моя репутация слишком мала, чтобы писать комментарии. Мне действительно нужно было потянуть его в инспекторе элементов в браузере, чтобы узнать, откуда идут стили, что-то может переписывать ваши стили.

Но вы могли бы также, возможно, попытаться добавить

max-width:50%; 

ваших CSS элементов для этих столбцов.

+0

Это не работает, Джо. –

+0

Какой размер они получают. Трудно разобраться с фактической «сломанной» разметкой. Если у вас уменьшится размер, попробуйте установить минимальную ширину до 50%, вы можете установить ширину до 50%, но у меня были нечетные результаты, когда мне нужно было установить минимум или максимум. Если вы используете инспектор элементов браузера, вы можете сказать много. Мне нравится 3D-инспектор firefox, кто-то недавно показал мне, и в некоторых случаях это очень полезно. – Joe

Смежные вопросы