Reduce white space between lines of text_问答_开发者

Reduce white space between lines of text

开发者 https://www.devze.com 2023-02-16 07:07 出处：网络

I am creating a webpage (first time) and i\'m following as much of the CSS rules and tags as I can.However, I ran into a problem with white space.I\'ve underlined the first line of text but now the se

相关专题：css

I am creating a webpage (first time) and i'm following as much of the CSS rules and tags as I can. However, I ran into a problem with white space. I've underlined the first line of text but now the second line seems to have drifted below. Is there a way to make it a bit more snug, i'd like the second line of text to be just below the above line.

body,td,th {
    color: #000000;
}

body { 
 margin: 0; 
 padding: 0; 
 padding-top: 6px;
 text-align: center;
 background-color: #FFFFFF; 
} 
#centered
{ 
 width: 800px; /* set to desired width in px or percent */
 text-align: left; /* optionally you could use "justified" */
 border: 0px; /* Changing this value will add lines around the centered area */
 padding: 0;  
 margin: 0 auto; 
} 
.style3 {
    font-size: 32pt;
    color: #666666;
    margin-l开发者_如何转开发eft: 0px;   
    border-bottom: 3px double;
}
.style5 {
    margin-left: 390px;
    font-size: 32pt;
    color: #CCCCCC;

}
-->

</style></head>

<div id="centered">


<body>
<p class="style3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FIRST LINE OF TEXT</p>
<p class="style5">INDENTED SECOND LINE</p>
</body>
</div>
</body>
</html>

You need to adjust the line-height. More specifically, add the following declaration:

.style5 {
    line-height: 0.72em;
}

If you only want the first line of .style5 to be snug, you need to adjust the top margin. Use this declaration instead:

.style5 {
    margin-top: -10px;
}

See fiddle.

Note: You should always validate your markup using the W3C Markup Validation Service and your css using the W3C CSS Validation Service. It will help you a lot when you're starting out.

p.style3, p.style5 {
    margin-top: 2px;
    margin-bottom: 2px;
}

Play with those two values until you are happy with the result :)

Have you tried the CSS line-height rule?
http://www.w3schools.com/css/pr_dim_line-height.asp

hmm. your code little buggy. first i see that you have div OUTSIDE of body tag.

try to validate your code.

anyway you can change the space weebven lines in the same paragraph with : p {line-height:0.7em} this creates a 7/10 line height of the font size.

if you want to decrease space between paragrapsh you shold change the margin|padding of the paragraphs. p{margin:0 91px 0 37px;padding:0 43px 0 19px}