Как изменить css для отображения двух виджетов рядом друг с другом? - PullRequest
Новая
       16

Как изменить css для отображения двух виджетов рядом друг с другом?

0 голосов
/ 29 января 2019

В настоящее время у меня есть 2 виджета, отображаемых поверх друг друга, поисковая форма и виджет с именем Widget1: 

  <div class="sc-kasBVs dkZIuy sc-bdVaJa iHZvIS">
    <div class="sc-bdVaJa zWLbK">
        <form>
            <div class="sc-RcBXQ jQyElD InputAddon__StyledInputAddon-fjFrIb fMydIy">
                <div class="sc-giadOv dyqhVk sc-bdVaJa iHZvIS">
                    <div class="sc-fONwsr iJfpTt Select__StyledSelectWrapper-hSZEhI DYFBu" name="searchCriteria" value="custName">
                    </div>
                </div><input class="sc-fcdeBU icqmWO Input__StyledInput-gzbIwR kYVFOW" type="text" placeholder="Enter name"
                    name="fullName" value=""><button class="InputAddonButton__StyledInputAddonButton-hHzFYs kAWAUc AccessibleFocusStyleHOC__StyledComponent-gUjKxJ kwchXi Button__StyledButton-gFCKw dXFaMb"
                    type="submit" label="Go"><span class="Button__InnerSpan-igXdGS hedSKc">Go</span></button>
            </div>
        </form>
    </div>
    <div class="sc-btzYZH eQQfcI sc-htpNat eLQHN sc-bdVaJa iHZvIS">
        <Widget1 />
    </div>
</div>

Это таблица стилей: 

@media screen and (min-width: 768px)
<style>…</style>
.zWLbK {
    width: 100%;
}

@media screen and (min-width: 480px)
<style>…</style>
.zWLbK {
    width: 100%;
}
<style>…</style>
.zWLbK {
    box-sizing: border-box;
    width: 100%;
    padding-left: 18px;
    padding-right: 100px;

form {
    display: block;
    margin-top: 0em;
}

div {
    display: block;
}
.eQQfcI {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-right: 147px;
    margin-bottom: 6px;
}
<style>…</style>
.sc-btzYZH {
}
<style>…</style>
.eLQHN {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
<style>…</style>
.sc-htpNat {
}
.iHZvIS {
    box-sizing: border-box;}

Мне бы хотелосьчтобы отобразить форму и виджет1 рядом друг с другом.Почему они отображаются поверх друг друга?

...