How can i fill button in the container?

I want to fill the button in the rest empty of the container. I've tried it with display: table-cell;width: 100%; but it's not working.

I use bootstrap 3 btn-block not working too.

I can set width with px for <button> but when i remove the <div class="product-social-links"> i get again white pleace in the container.

Current state: Current state:

What i want to do: What i want to do:

<div class="product-info-actions">
    <div class="product-add-form">
        <form data-product-sku="24-UG01" action="xxxx" method="post" id="product_addtocart_form" novalidate="novalidate">                           
            <div class="box-tocart">
                <div class="fieldset">
                    <div class="field qty">
                        <label class="label" for="qty"><span>Qty</span></label>
                        <div class="control control-qty-cart">
                            <span class="quantity-controls quantity-minus"></span>
                            <span class="quantity-controls quantity-plus"></span>
                        </div>
                    </div>
                        <div class="actions" style="font-size: 20px;">
                            <button type="submit" title="Add to Cart" class="action primary tocart" id="product-addtocart-button">
                                <span><i class="fa fa-shopping-cart" style="color: white;"></i>&nbsp;Add to Cart</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="product-social-links">
        <div class="product-addto-links" data-role="add-to-links">
            <a title="Add to Wish List" href="#" class="action towishlist" data-post="" data-action="add-to-wishlist">
                <span>Add to Wish List</span></a>
            <a title="Add to Compare" href="#" data-post="" data-role="add-to-links" class="action tocompare">
                <span>Add to Compare</span>
            </a>
            <div class="clearfix"></div>
        </div>
    </div>
</div>


Read more here: https://stackoverflow.com/questions/64408637/how-can-i-fill-button-in-the-container

Content Attribution

This content was originally published by Efex at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: