我一直在尝试将 3 个不同的元素放入 div 中,但遇到了问题。我似乎无法摆脱标题和段落之间的巨大空白。我使用了一个关于边距和填充的文档来解决这个问题,虽然我取得了一些进展,但仍有一些未解决的问题。
我的尝试:
<html>
<header>
<link rel="stylesheet" type="text/css" href="style2.css"></header>
<body class="about">
<div class="content-wrapper">
<img class="hk-img" src="hksquared.jpg" height= "400px" width="400px">
<h1 class="text-header-content">Web Development. Software Development. E-commerce. Photograpy.</h1>
<p class="text-content">Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Curabitur blandit tempus porttitor. Donec ullamcorper nulla non metus auctor fringilla. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Maecenas faucibus mollis interdum.<br><br><br>Vestibulum id ligula porta felis euismod semper. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec sed odio dui. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
</p>
</div>
</body>
</html>
CSS:
/*About page content*/
.content-wrapper{
display: inline-block;
width: 1000px;
padding:0px;
margin-top: 50px;
margin-right: 100px;
margin-left: 50px;
position: fixed;
border:2px solid black;
}
.text-header-content{
display: inline;
width: 400px;
float: right;
padding:0px;
margin-top: 0px;
}
.text-content{
display: inline;
width: 400px;
padding:0px;
color: black;
float: right;
margin-bottom: 0px;
padding-bottom: 0px;
}