CSS Margins Increase with H1 Length
Conside开发者_如何学Gor the following markup:
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
<link href="screen.css" rel="stylesheet" />
</head>
<body>
<h1>Test</h1>
<h3>Description</h3>
</body>
</html>
And the CSS:
h3{
margin-top: -25px;
}
Now, I want the H3 to have a margin-left of however long H1 is, and it is consistently 20px away. So, if I have a H1 block of 200px long, then H3 would have a margin-left of 220px, and so on and so forth. How would I do this?
I think what you actually want is:
h1 {
display: inline;
}
h3 {
display: inline;
margin-left: 20px;
}
Doesnt this do what you want?
h1 {
float:left;
}
h3 {
margin:0 0 0 20px;
float:left;
}
If the h3 should be in the line below the H1, but still right to the H3 (did you mean that?), then I have a (maybe non optimal) solution, that works for me:
#title {
float:left;
}
#h3wrapper {
float:left;
}
h3 {
margin-top: -25px;
}
HTML:
<h1 id="title">Test</h1>
<div id="h3wrapper">
<h1> </h1>
<h3>Description</h3>
</div>
加载中,请稍侯......
精彩评论