bootstrap modal - 如何将模态宽度设置为与其显示的文本一样宽

Question

我正在使用Bootstrap Responsive v2.3.2 modal向用户显示弹出式模式。

如何调整模式的大小，使模式仅与其显示的信息一样宽，而不是固定在用户屏幕上或大于用户屏幕上的宽度，并且模态仍然在用户屏幕中居中？

我尝试在css中添加 width：auto; ，如下所示：

.modal {
    position: fixed;
    top: 3%;
    right: 3%;
    left: 3%;
    width: auto;
    margin: 0 auto; /* this line of code will center align the modal to the screen */
    background-color: orange;
}

.modal-body {
    height: 60%;
    max-height: 350px;
    padding: 15px;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin-left: 0;
    background-color: yellow;
    width: auto;
}

.modal-confirm-max-width {
    min-width: 50px;
    max-width: 950px;
    word-wrap: break-word;
    word-break: break-word;
    margin: 0 auto; /* this line of code will center align the modal to the screen */
    width: auto;
    background-color: lime;
}