html - 我的导航栏不符合我的 div.container？-6ren

html - 我的导航栏不符合我的 div.container？

转载作者：行者123 更新时间：2023-11-28 05:16:10

25

4

header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}

nav {
    line-height:30px;
    background-color:gainsboro;
    height:548px;
    width:100px;
    float:left;
    padding:px;
}

body {
	background-color:Lavender;
}

article {
	float:right;
	height:1250px;
	width:580px;
	text-align:center;
	padding:1em;
	background-color:#5DADE2;
}

section {
    float:left;
	height:1320px;
	width:600px;
	text-align:center;
    padding:0em;  
	background-color:#ECF0F1
}

footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;    
}

div.container {
	width:100%;
	border:2px solid purple;
}

.clearfix {
	overflow: auto;
}

.clear {
    clear:right;
    line-height:0;
}

<!DOCTYPE HTML>
<html>

<head>

<title>Links - Bannerlord Assignment</title>

<link rel="stylesheet" type="text/css" a href="BannerlordTheme2.css">

</head>

<div class="container">

<body>

<header>

<h1>Further Information</h1>

</header>

<nav>
<a href="Home.html">Home</a><br>
<a href="About.html">About</a><br>
<a href="Media.html">Media</a><br>


</nav>

</body>

</div>

<br class="clear" />

</html>

请耐心等待我，我知道这是非常基础的，但我需要从某个地方开始，我既找不到答案也找不到原因。

我的导航栏与我的 div 的边框不对应，这不是什么大问题，但我如何获得它，以便在我使用边框时导航栏和标题不重叠，因为现在 div 边框仅在页眉上工作。

最佳答案

您需要将溢出隐藏到容器中。

header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}

nav {
    line-height:30px;
    background-color:gainsboro;
    height:548px;
    width:100px;
    float:left;
    padding:px;
}

body {
	background-color:Lavender;
}

article {
	float:right;
	height:1250px;
	width:580px;
	text-align:center;
	padding:1em;
	background-color:#5DADE2;
}

section {
    float:left;
	height:1320px;
	width:600px;
	text-align:center;
    padding:0em;  
	background-color:#ECF0F1
}

footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;    
}

div.container {
	width:100%;
	border:2px solid purple;
    overflow: hidden;
}

.clearfix {
	overflow: auto;
}

.clear {
    clear:right;
    line-height:0;
}

<!DOCTYPE HTML>
<html>

<head>

<title>Links - Bannerlord Assignment</title>

<link rel="stylesheet" type="text/css" a href="BannerlordTheme2.css">

</head>

<div class="container">

<body>

<header>

<h1>Further Information</h1>

</header>

<nav>
<a href="Home.html">Home</a><br>
<a href="About.html">About</a><br>
<a href="Media.html">Media</a><br>


</nav>

</body>

</div>

<br class="clear" />

</html>

关于html - 我的导航栏不符合我的 div.container？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39303291/

25

4

0

文章推荐： html - 让我的 Bootstrap 导航栏更大一点

文章推荐： javascript - 我不知道如何修复此代码

文章推荐： javascript - 带输入框的jqGrid不可点击

文章推荐： javascript - 如何获取选择框选项值中输入文本字段的值

SwiftUI 符合 Hashable
我们如何让 SwiftUI 对象，尤其是 Image，符合 Hashable 协议(protocol)？我知道它们符合 Equatable 协议(protocol)，所以主要问题是如何获取哈希值，或
ios - 符合 AVAudioPlayerDelegate
我遇到了一些符合 AVAudioPlayerDelegate 的奇怪问题。以下正是我在一个全新的 Xcode 项目中所拥有的: import UIKit import AVFoundation cla
swift - 符合 NSCoding
我一辈子都弄不明白为什么我会收到此类不符合 NSCoding 协议(protocol)的错误。也许另一双眼睛会有所帮助。我试图添加注释以明确每个函数在做什么。 import Foundation im
符合 C 标准的结构对齐方式
关闭。这个问题需要details or clarity .它目前不接受答案。想改进这个问题吗？通过 editing this post 添加细节并澄清问题. 关闭 9 年前。 Improve t
xhtml - 符合 XHTML 的意义何在？
所有现代浏览器都理解 HTML，所以除了在键盘最右侧编写更多字符之外，兼容 XHTML 的意义何在。最佳答案没有一点我能想到的。 W3C 已经取消了 XHTML 2.0，尽管应该有一个 XHTML
oop - 符合 Liskov 的状态设计模式
我正在设计一个订单系统，状态设计模式似乎很合适，因为订单可以更改其状态，从而更改订单允许的功能。下面是我的基本类图: 我不喜欢这种方法，因为客户端无法查看某个方法是否受支持并且违反了里氏原则。我在下面
neo4j - 符合 neo4j 中的模式
我正在考虑使用图形数据库来存储 IFC数据。理想情况下，数据库应该提供一种方法来定义 IFC 架构中定义的所有规则类型。但是，我不认为有任何这样的数据库，因为 IFC 中的某些规则类型非常复杂并且需要
fips - 符合 FISMA/其他联邦信息系统要求的散列算法
我所在的组织必须满足 FISMA 对启用 FIPS 的系统的要求。我正在尝试做的一件事是为我们的密码实现哈希算法。我对此有很多选择:SHA-2、MD5、bcrypt(使用 Blowfish)、RIPE
Swift:CoreData 符合 MKAnnotation
我正在尝试实现我的自定义 CoreData Carpark 实体以符合 MKAnnotation，就像我们如何使 class 对象符合 >MKAnnotation. 我根据以下帖子调整了我的实现:th
swift - 符合 'CBCentralManagerDelegate'协议(protocol)
我在 project-Swift.h 文件中收到名为“CBCentralManagerDelegate”的 No 类型或协议(protocol)。不知道我在这里哪里出错了。我认为这与 swift.h
c++ - 从原始内存中读取值(符合 MISRA)
我正在尝试读取之前写入 NVM 闪存的变量的值。我的代码是: uintptr_t address = getAddress(); //[MISRA C++ Rule 5-2-8] cast from
java - 符合 .implements 的数组
所以我有这个练习要解决。我必须创建第一个。一个名为 Printable 的接口(interface)，它有一个 put() 方法，该方法将接受实现 Comparable 的对象。完成 interfa
c - 符合 IEEE754 的结构
我的问题涉及 IEEE 754 单精度数字。假设我有一个结构: typedef struct __ieee754 { int sign; int exponent; int mant
c++ - 符合 STL 的内存分配器库
我需要使用 map，键为 uint32_t，值为 Meshes。我希望将网格布局在连续的内存中以 boost 性能，因为它们将经常被连续访问。我想知道有哪些内存分配器库可以提供以下内容；分配给连续
符合 C++ STL 的分配器
在处理小对象时，有哪些分配器可用于 STL。我已经尝试过使用 Boost 的池分配器，但没有得到任何性能提升(实际上，在某些情况下性能下降相当大)。最佳答案你没有说你使用的是什么编译器，但它可能带
符合 c++ STL 的迭代器迭代器
我想做什么我有一种划分事物的方法。此方法不会对数组进行完全排序；它只是简单地对数组进行分区，以便一侧的所有元素(某些预先确定的“中心”或“中点值”——但它不必导致均匀拆分)小于“中心”和另一侧的所有
http - 符合 RESTful 标准的设计
假设我需要开发一个 REST 银行应用程序允许创建/销毁银行账户以及对帐户进行以下操作:withdraw/credit/getBalance。创建帐户 PUT/银行/约翰这里我使用 PUT 而不是
ios - 符合 Equatable 的单元测试策略
假设我有一个 struct 符合我的模型的 Equatable，如下所示: struct Model: Equatable { var a: Int = 0 var b: String
swift - 符合 Decodable 的类不需要初始化器
我目前正在研究 Decodable、Encodable 和 friend ，试图理解它背后的“魔法”。以下是我发现不寻常的一件事: class Person: Decodable { var n
swift - 符合 RawRepresentable 的枚举
在 Swift 书中，枚举的例子很好用 enum CompassPoint: String { case north, south, east, west } var northCom = C

首页

博学

6Ren·AI

商城

html - 我的导航栏不符合我的 div.container？