如何在不影响标题内容的情况下将div浮动到标题div的右侧？
乔恩·凯奇（Jon Cage）
我想知道如何获得以下结果：
绿色是一个容器div，宽度为700像素。蓝色是标题区域，该区域在绿色容器的宽度方向上以中间居中的一些标题文本填充。红色需要在右边浮动而不影响标题中文本的流动。
我该如何实现？我尝试过浮动右侧的红色框，但由于某种原因，它似乎将标题中的文本推到左侧。
编辑-作为记录，我没有发布示例，因为HTML和CSS并不是我真正的专业领域，并且我正努力回到示例中文本不对齐的情况（尝试了六种不同的方法）我一直在阅读的方法）。
这大致就是我正在尝试的内容：http : //jsfiddle.net/3fgytw0u/
<!DOCTYPE html>
<head>
<title></title>
<style>
#Container {
width: 700px ;
margin-left: auto ;
margin-right: auto ;
}
#Title {
background-color: red;
text-align: center;
}
#GameGuidelines{
align:right;
width: 200px;
background-color: grey;
}
</style>
</head>
<body>
<div id="Container">
<div id="Title">
<h1>This</h1>
<h2>Is</h2>
<h2>A</h2>
<h2>Long</h2>
<h2>Title Title Title Title</h2>
</div>
<div id="GameGuidelines">
<ul>
<li>Some</li>
<li>Info</li>
<li>Here</li>
</ul>
</div>
<div id="Introduction">
<p>Rest of the page continues here</p>
</div>
</div>
</body>
</html>
SRing
将元素上移到标题中，将其设置为position:absolute并给它一个margin-left:500px;
http://jsfiddle.net/3fgytw0u/2/ <-那个是正确的
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
如何在不影响设计的情况下将该图像正确放置在标题旁边
- 2
如何在不影响先前视图的情况下更改UINavigationBar标题的名称？
- 3
如何在不影响标题的情况下使用这个 awk 命令
- 4
如何在不影响父div的情况下将保证金应用于子div？
- 5
如何在不影响其他div的情况下隐藏/显示匿名div
- 6
如何在不弄乱边框的情况下将<div>保留在标题中？
- 7
在不影响标题的情况下更改UITableView的Alpha
- 8
如何在不指定固定宽度的情况下将无序列表（ul）浮动到图像的右侧
- 9
如何在不影响双击缩放的情况下禁用WebView中的内容触摸。
- 10
如何在不影响PDF内容的情况下增加PDF的大小
- 11
如何在不影响文本的情况下删除 <a> </a> 标签？
- 12
如何在没有浮动的情况下将div彼此相邻放置？
- 13
如何在不影响Primefaces中的输出标签的情况下将inputText设置为必填？
- 14
如何在不影响边框的情况下将CALayer的背景设置为透明？
- 15
如何在不影响滚动的情况下将onTouchListener实现到列表视图的项
- 16
如何在不影响此参数的情况下将参数绑定到jQuery回调
- 17
如何在不影响文件的情况下将字节插入PDF，然后将其分开？
- 18
如何在不影响此参数的情况下将参数绑定到jQuery回调
- 19
如何在不影响 Edge 的情况下将样式应用到 Chrome
- 20
如何在不使用浮动的情况下将框内的图像对齐到右侧
- 21
如何在不影响原始内容的情况下仅对内容的反射进行样式设置？
- 22
如何在不影响页面加载量大的内容的情况下加载高分辨率的背景图像
- 23
如何在没有垂直滚动标题的情况下使DIV的浏览器高度达到100％
- 24
如何在没有垂直滚动标题的情况下使DIV的浏览器高度达到100％
- 25
如何在不移动整个<div1>的情况下将<div1>的已创建内容移动到<div2>并继续在<div1>中创建元素？
- 26
如何在不影响GIT的远程存储库的情况下将更改保留在本地分支中？
- 27
如何在不影响CSS文件的情况下将所有页面重定向到根目录？
- 28
如何在不影响正在运行的 pod 的情况下从 docker hub 将新镜像拉到 kubernetes？
- 29
如何在不替换div的情况下使div文本内容自动换行，并使div向右扩展？
我来说两句