Поломанные отступы

Поломанные отступы

Использую кастомный лейаут,

скрин

Не поминаю, почему сам контейнер широкий, а внутри него всё скукожилось.

Вот код лейаута:

<aura:component implements="forceCommunity:themeLayout">

<aura:attribute name="search" type="Aura.Component[]"/>
<aura:attribute name="sidebarFooter" type="Aura.Component[]"/>
<div class="slds-grid slds-grid--align-center">
<div class="slds-col">
<div class="slds-grid slds-grid--vertical">
<div class="slds-col">
<div class="logoContainer"></div>
</div>
<div class="slds-col">
{!v.search}
</div>
<div class="slds-col">
<c:verticalNav/>
</div>
</div>
</div>
<div class="slds-col content">
{!v.body}
</div>
</div>
</aura:component>

.THIS .logoContainer {

background-image: t('url(' + brandLogoImage + ')');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
z-index: 99;
cursor: pointer;
position: relative;
max-width: 100%;
max-height: 52px;
display: block;
outline: 0;
height: 50px;
margin-top: 10px;
}

.THIS .slds-col .ui-widget {
margin: 6px;
}

.THIS .slds-col.content {
width: 1140px;
}

.THIS .container {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
cursor: pointer;
position: relative;
max-width: 100%;
display: block;
outline: 0;
margin-top: 10px;
}

.THIS .container .text {
min-width: 100%;
}

Так по коду сложно сказать.
Ищи в консоли браузера в Element Inspector.
Наводи на input и textarea и смотри что за стили к ним применились. Возможно подвязалось что-то чего нет в твоих исходниках. Учишь пользоваться консолью браузера, при должной сноровке любые косяки со стилями находится на раз.

Interesting information? Help us, post link to social media..