简体   繁体   中英

Align span in Bootstrap columns

So I'm trying to align the Swipe Icon to the right without padding-right: 0; doesn't work:(

Herse some Code and Images: 在此处输入图片说明

Here's my HTML:

<div class="col-sm-4">
    <span class="c-visualslider__swipeicon"></span>
</div>

and my SCSS:

.c-visualslider {
    padding: 528px 0 80px;
    position: relative;
    background: map-get($colors, black);

    &__swipeicon {
        height: 34px;
        margin-top: 8px;
        width: 32px;
        display: inline-block;
        background-repeat: no-repeat;
        background-image: (image);

add three css properties to swipeicon

display: flex; 
justify-content: flex-end; 
margin: 8px 0 0 auto;

try this

.c-visualslider {
    padding: 528px 0 80px;
    position: relative;
    background: map-get($colors, black);

    &__swipeicon {
        height: 34px;
        width: 32px;
        background-repeat: no-repeat;
        background-image: (image);

        display: flex;
        justify-content: flex-end;
        margin: 8px 0 0 auto;

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM