Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Double Space with <br>

Posted on 2013-02-07
4
Medium Priority
?
249 Views
Last Modified: 2013-02-17
Hi,

When using a <br> it makes 2 spaces between lines:

			<span style="font-size: 12px"><font face=""><font face="Arial, Helvetica, sans-serif"><strong><span style="font-size: medium;"><span style="color: #cc0000;">John</span></span></strong> </font></font><span style="font-family: arial, helvetica, sans-serif"><strong><span style="font-size: medium;"><span style="color: #808080;">Doe</span></span></strong></span><font face=""><font face="Arial, Helvetica, sans-serif"><span style="font-family: arial, helvetica, sans-serif"><br />
			</span></font></font><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: xx-small;"><em>Title 1</em></span></span><font face=""><font face="Arial, Helvetica, sans-serif"><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: xx-small;"><span style="color: #cc0000;">?</span> </span></span></font></font><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: xx-small;"><em>Title 2</em></span></span><font face=""><font face="Arial, Helvetica, sans-serif"><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: xx-small;"> <span style="color: #cc0000;">?</span> </span></span></font></font><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: xx-small;"><em>Title 3</em></span></span>

Open in new window

double-space.jpg
0
Comment
Question by:Computer Guy
  • 2
4 Comments
 
LVL 42

Expert Comment

by:Meir Rivkin
ID: 38863473
0
 
LVL 42

Expert Comment

by:Meir Rivkin
ID: 38863475
here's the solution from the link posted above:


Css:

br {
   display: block;
   margin: 10px 0;
}
The solution is probably not cross-browser compatible, but it's something at least. Also consider setting line-height:

line-height:22px;
For Google Chrome, consider setting content:

content: " ";
Other than that, I think you're stuck with a JavaScript solution.
0
 
LVL 27

Expert Comment

by:Cornelia Yoder
ID: 38863502
I believe you are missing an end span in the first line, and the system is putting one in at the end, causing the extra line.
0
 
LVL 45

Accepted Solution

by:
Chris Stanyon earned 2000 total points
ID: 38863553
Wow. That is probably the worst HTML that I've seen for a long, long time. Is there a particular reason for it? Have a look at the following. It does the same thing, only properly:

<div class="person">
	<h2><em>John</em> Doe</h2>
	<p>Title 1 <em>?</em> Title 2 <em>?</em> Title 3</p>
</div>

<style type="text/css" media="screen">
	.person { font-size:12px; font-family: arial, helvetica, sans-serif; }
	.person h2 { margin:0px; color: #808080; font-size:medium; }
	.person p {  margin:0px; font-size: xx-small; font-style:italic; }
	.person em { color: #cc0000; font-style:normal; }
</style>

Open in new window

Adjust the space between the lines by either adding a top margin to the P or a bottom margin to the H2.

FYI: The font tag is deprecated.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

581 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question