HTML CSS实现两个按钮居中显示 - 轻松实现页面布局

<style>
    .call-to-action {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
    }

    .call-to-action a {
        margin-left: 20px;
    }
</style>
<div class='call-to-action-area gray-bg ptb-60'>
    <div class='container'>
        <div class='form-group'>
            <label></label>
            <textarea class='form-control' id='chat-gpt-input' placeholder='输入问题' rows='3' resize='none'
                style='width: 100%; margin: 0 auto; background-color: #f4f4f4; color: #333; border: 1px solid #ccc; border-radius: 12px;'></textarea>
        </div>
        <div class='call-to-action'>
            <a onclick='callCHATGPT()' class='btn btn-large' href='#'
                style='background-color: #4cae4c; color: #fff; font-weight: bold; border-radius: 5px; padding: 10px 20px; border: none; box-shadow: none; text-decoration:none;'
                onmousedown='this.style.backgroundColor='#3c903c'' onmouseup='this.style.backgroundColor='#4cae4c''>回答</a>
            <a onclick='clearTextArea()' class='btn btn-large' href='#'
                style='background-color: #d9534f; color: #fff; font-weight: bold; border-radius: 5px; padding: 10px 20px; border: none; box-shadow: none; text-decoration:none;'
                onmousedown='this.style.backgroundColor='#c9302c'' onmouseup='this.style.backgroundColor='#d9534f''>清空</a>
        </div>
        <div class='form-group'>
            <label></label>
            <textarea class='form-control' id='chatgpt-response'
                placeholder='长途访问，请耐心等待回答 Ai生成它很快，但是由于网络问题我们需要等待，通常内容越长等待越久 如果长时间没反应请刷新页面重试' rows='26' resize='none'
                style='width: 100%;height: auto; margin: 0 auto; background-color: #f4f4f4; color: #333; border: 1px solid #ccc; border-radius: 10px; overflow: scroll;'></textarea>
        </div>
    </div>
</div>