【问题标题】:Date header overlapping Post title日期标题重叠帖子标题
【发布时间】:2015-06-05 00:19:49
【问题描述】:

所以我将日期标题移到了我在 Blogger 上的帖子标题下方,而在最新的帖子中,日期一直与标题重叠。如果我使用边距或填充,它会影响其他日期标题,所以我不太确定该怎么做。博客是here。这是我认为相关的唯一代码(其中 h3 是帖子标题):

h3 {
text-align: center !important;
}

h3 a{
color: #424242;
transition: 0.5s ease;
}

h3 a:hover {
color: #58c5d2;
}

.date-header {
text-align: center !important;
float: below;
}

.date-header span {
letter-spacing: 10px !important;
}

h2 {
text-align: center !important;
}

.date-posts {
margin-top: 40px;
}

h3 {
margin-bottom: -25px !important;
}

提前感谢您的帮助!

【问题讨论】:

    标签: html css date templates blogger


    【解决方案1】:

    h3 样式设置为:

    margin-bottom: 0;

    由于负边距,日期被拉到标题中。

    【讨论】:

    • 这修复了重叠问题,但日期仍然比其他日期更接近标题?有什么办法吗?
    • 这是因为您只更改了检查器中的一个元素。在样式表中更改它应该为所有标题修复它。
    • @dcardoso 也是正确的 - 它解释了第一篇文章的外观差异。
    • 样式表是我更改的。
    • 你想要哪一个?您不断更改现场站点上的内容,因此外观会发生变化。您希望日期在标题下方多远?
    【解决方案2】:

    您的问题出在您的 html 中...您没有在第一篇文章中关闭一个或两个 html div 标签。

    每个.post-outer 应该处于同一级别。

    【讨论】:

    • 它们都在模板中关闭了,我检查了。
    • 好吧,开发人员工具通常会尊重结束标签,这对我来说似乎不合适。此外,您的 css 已应用于您的所有课程,我看不到任何可以将不同样式应用于第一篇文章的内容。
    【解决方案3】:

    核弹!!!!!!!

    h3 {
      /* margin-bottom: -25px !important; */
    }
    

    编辑:最初的问题是,如何防止日期和标题重叠。这是使用开发人员工具找到的快速而肮脏的修复方法(因此强烈推荐使用 chrome)。

    【讨论】:

    • 它只是用来尝试修复其他日期标题,但它不会改变第一个日期太接近标题的问题。
    • 请在您的回答中提供一些有用的 cmets,说明您认为这会解决问题的原因。这样做将有助于您的读者学习。
    猜你喜欢
    • 1970-01-01
    • 2019-07-30
    • 1970-01-01
    • 1970-01-01
    • 2013-05-19
    • 2022-10-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多