1

在 JQuery Mobile 中，我正在创建一个标题，其左侧对齐后退按钮和中心对齐标题。理想情况下，这两个元素应该在同一行对齐，但是当由于空间原因不能在同一行中容纳两个元素（尤其是在描绘模式下）时，标题应该向下移动到后退按钮下方。应该使用什么 CSS 属性？

这是代码：

<div class="back-header" data-role="header" data-position="fixed" position="absolute" data-theme="a">

    <a href="index.html" data-icon="arrow-l" data-iconpos="left" data-transition="slide" data-direction="reverse" class="back-button">Back</a>

    <p class="menu-label" align="center">
            <img src="images/biglogoreduced.png" class="menu-label-image" height="20" width="20">
        Data Monitor
    </p>


</div>
4

1 回答 1

2

我给你做了一个工作示例：http: //jsfiddle.net/Gajotres/TRZjY/

调整“结果窗口”的大小以查看差异。

@media all and (max-width: 300px) {
    h3.ui-title {
        margin: 40px 5% 0.8em !important;
        white-space: normal !important;
    }
}

自定义max-width: 300px根据您的需要，具体取决于您的标题。同时更改 边距：40px 5% 0.8em !important; . 您应该只更改 40px，因为我使用 h3 标签作为标题容器。

于 2013-03-19T13:13:52.487 回答