Centering a button inside a inside a

I have a page with multiple images floating, each of them has a text. The code looks like this (don't mind italian words):

<section id="libri">
        <div class="book1">
        <img src="images/alberolaura.jpg" height="250px" width="170px" alt="L'albero Laura">
        <p><a href="#" target="_blank"><button class="acquista"><i class="fa fa-shopping-cart"></i>  Acquista</button></a> <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit Lorem ipsum dolor sit amet, consectetur adipiscing elitLorem ipsum dolor sit amet, consectetur adipiscing elit Lorem ipsum dolor sit amet, consectetur adipiscing elitLorem ipsum dolor sit amet, consectetur</p>
        </div>

This repeats 9 times for 9 images, of which you can see the size (It's always the same). As you can see I have a button which must go in each paragraph, the problem is how to center It relatively to the text. Now, in my CSS I came up with this for images and paragraphs:

#libri div {
    height: 250px;
    width: 430px;
    display: inline-block;
    overflow: hidden;
    float: left;
    /*border:1px solid;*/
    margin-bottom: 5px;
    margin-right: 5px;
}

#libri div>img {
    vertical-align: middle;
}

#libri div:hover {
    background-color: #5fed8c;
    transition: 0.8s ease;
}

#libri p {
    display: inline-block;
    width: 250px;
    text-align: left;
    font-family: Lato;
    font-size: 17px;
    vertical-align: top;
}

and this for the button:

.acquista {
    background-color: #9be8b3;
    border: 2px solid #000000;
    border-radius: 5px;
    color: #000000;
    padding: 8px 12px;
    font-size: 12px;
    cursor: pointer;
    position: relative;
    left: 130px;
}

I tried making some math, if my div has width 430px and my image alone has width 170px, then my paragraph alone should be 260px. I tried putting "position:relative and left:130px" to center the button, but It didn't work.

Sorry if I've written too much, I'm quite a beginner.

Thank you in advance.