我正在创建一个个人网站,发现了一个错误,在Firefox或Chrome上使用我的Android手机,页面第一次将正确加载,但是当我刷新页面时,加载的方式就不同了。
我使用jQuery动态地确定视口的大小,从而正确地将内容放置在它下面。最终发生的情况似乎是,函数以0的高度查看图像,并将内容放在页面的最上面,而不是将其定位在图像下面。如果我向下滚动页面并向上滚动,图像就在那里。
这并不发生在我的桌面上,所以它似乎是移动特定的。
执行动态调整大小的jQuery函数如下所示。
// This line simply puts the content below the image at either
我有一个未修复的导航栏和两个列。使用桌面布局没有问题,但当我测试移动屏幕大小的响应性时,我需要A列填充其余视口的高度,B列位于A列的下方。此外,我需要一个不涉及硬编码的解决方案,比如减去导航栏的高度。我试过使用Flexbox,但我没有让它工作。相反,我得到的是两个列都出现在视口中。我使用Bootstrap来提高响应速度。 Here there is a figure,这说明了我的问题。以下是我到目前为止尝试过的代码: .flex-container {
display: flex;
flex-direction: column;
}
#content {
fle
在过去的3天里,我一直在寻找解决这个问题的方法,但没有结果。
所以,我有一个HTML页面,它必须适合这个窗口,我使用的是引导4.1.1。这个页面非常简单:
1标题行,自动或固定高度
一个内容行,必须填充剩余的窗口空闲空间。
整个代码大约有250行,因此我将尝试只编写一个我需要的示例:
<body>
<div id="header" class="container-fluid">
<!--Bootstrap rows and stuffs that actually work well
</div>