Question

我想为这个网络应用程序创建一个旧学校命令行界面。我似乎无法获得命令提示符和输入区域的关键细节。

它应该在同一条线上。我怎么能这样做？

我的尝试在提示和contenteditable div上使用内联块。

示例是here，我认为问题可能出在CSS中：

.ux-command-container {
    clear:both;
    width:100%;
    display:block;
    font-size:0px;
    height:0px;
    margin:auto;
}
.ux-command-line {
    display:inline-block;
    font-size:12px;
    width:90%;
    word-wrap:break-word;
    vertical-align:top;
    padding:0;
    margin:auto;
    padding:0;
    line-height:12px;
    margin:0 auto;
}
.ux-command-line:focus {
    outline:none;
}
.ux-command-prompt {
    vertical-align:top;
    display:inline-block;
    width:20px;
    margin:auto;
    padding:0;
    font-size:12px;
    line-height:12px;
    white-space:normal;
}

Answer 1

您需要删除

white-space: pre

来自

.ux-panel

声明

内联块推动两条线

1 个答案: