html - 在 CSS 中 float 一个 DIV

标签 html css

我有以下网址:Website

我真正想要做的是像现在一样将天气 DIV float 在页面顶部,但是当我展开或折叠它时,它只是浮​​动在顶部并且不会将任何内容向下推。如何实现?

我的天气 DIV CSS:

#weather {
    margin: 0 auto;
    padding: 0;
    width: 177px;
    font: 75%/120% Arial, Helvetica, sans-serif;
    top: 0;
    position: relative;
    z-index: 999999999;
}

最佳答案

绝对定位

#weather {
    position: absolute;
    left: 50%;
    width: 177px;
    margin-left: -88px; /* 50% of the width */
}

并给你的 body 一个padding-top当前包装的高度

body {
    padding-top: 50px; /* or so */
}

关于html - 在 CSS 中 float 一个 DIV,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15624620/

相关文章:

javascript - 保持 2 个 div 之间的距离恒定

javascript - jquery 在页面中间居中一个div

css - 由于在上半部分添加了额外的文本而扰乱了 bootstrap4 按钮的水平对齐方式?

javascript - 将 Dropzone.js 与其他字段集成到现有的 HTML 表单中

javascript - 是否可以通过滚动到元素来滚动元素上方/下方

html - anchor 链接跳转至 Xenforo 中的文档根目录

css - 水平图像对齐 CSS

javascript - 谁能告诉我为什么我的 Scrollspy 不工作?

html - 安培 : Toggle CSS Class

html - CSS 将表格列转换为全 Angular 堆叠元素