#html #css #getuikit
#HTML #css #getuikit
Вопрос:
вот мой код
<div class="uk-container">
<div class="uk-child-width-1-3@m uk-child-width-1-1@s" uk-grid>
<div class=" global-border outer-grid">
<div class=" main-color" uk-grid>
<div class="uk-width-2-5 coine-card bg-yellow inner-grid" >
</div>
<div class="uk-width-1-5 bg-yellow-lm timer coine-card inner-grid">
</div>
<div class="uk-width-2-5 coine-card bg-yellow inner-grid" >
</div>
</div>
</div>
<div class=" global-border outer-grid">
<div class=" main-color" uk-grid>
<div class="uk-width-2-5 coine-card bg-yellow inner-grid " >
</div>
<div class="uk-width-1-5 bg-yellow-lm timer coine-card inner-grid ">
</div>
<div class="uk-width-2-5 coine-card bg-yellow inner-grid" >
</div>
</div>
</div>
<div class="global-border outer-grid">
<div class="bg-yellow" style="height: 200px">
some stuff
</div>
</div>
</div>
</div>
у меня есть внешняя сетка с 3 столбцами (у них есть класс внешней сетки), а внутри 2 из этих столбцов у меня есть еще 3 столбца uk-grid (у них есть класс внутренней сетки), за исключением одного из них, в котором есть только div с some stuff
в нем!
вот результат
по какой-то причине внутренние сетки игнорируют родительское левое заполнение, в результате чего их содержимое кажется слипшимся… только последний столбец, у которого самая плотная внутренняя сетка, похоже, учитывает родительское левое заполнение
почему это происходит и как я могу это решить?
вот jsfiddle
Ответ №1:
Это:
.uk-grid {
margin-left: -30px;
}
Удалите это, и вы должны получить желаемый результат!
ПРИМЕЧАНИЕ: я также заметил, что у вас было несколько ошибок форматирования в вашем HTML, например:
<div class=" main-color" uk-grid>
Вероятно, вместо этого должно выглядеть так:
<div class="main-color uk-grid">
Комментарии:
1. спасибо, это не ошибки форматирования … именно так работает фреймворк uikit, и я предпочитаю не касаться фреймворка core css
2. Могли бы вы просто добавить пользовательский класс и переопределить фреймворк css там, где вам это нужно? ` .tableAdjustment{ margin-left: 0px !важно; }` @hretic