Help - Search - Members - Calendar
Full Version: changing the how much space <br> makes
Forums > Resource Center > Webmasters' Corner > Webmasters' Corner Resolved Topics
JackRapington
I am pretty sure there is a code for this right? To edit how much space the br makes between words and such.

I think this was already asked but I couldn't find the old topic so I wasn't sure.
Maccabee
Well this isnt actually br but if your trting to change the distance

between
two rows

of words.

Then you can use line-height:; but to make it affect the text youd have to put the text in some sort of class and then in the tect's css chnage the line height.

So if the text is 8px when you set the line-height to 20px it will make the height of each line 20px making the space between lines greater.

Or if you want to space object you can just play around the padding and spacing to position stuff.
itsmattadams
Use a horizontal rule. Here's some HR graphics.
--DANNY--
I would use <hr /> in place of <br />
and then adjust the height with:

<style type="text/css">
hr { height: 20px; }
</style>


... play around with the 20px value until you get the desired spacing.
synatribe
<br> is the most space (like 3 spaces) <br/> is like 2 space and <br / > is about 1 space, or at least thats how it appears whenever I edit templates?
mipadi
QUOTE(Aberisk @ Nov 21 2008, 10:16 AM) *
<br> is the most space (like 3 spaces) <br/> is like 2 space and <br / > is about 1 space, or at least thats how it appears whenever I edit templates?

<br>, <br/>, and <br /> are the same tag.
--DANNY--
QUOTE(mipadi @ Nov 21 2008, 10:35 AM) *
<br>, <br/>, and <br /> are the same tag.

Correct.

<br> should always be used when coding valid HTML.
<br/> or <br /> should always be used when coding valid XHTML.
I'm used to closing all single tags since I work mainly with XHTML, and the majority of websites are using XHTML now anyways.

But being that they are the exact same tag, they have the same attributes. So there is absolutely no difference whatsoever, if there is, I'm curious as to what web browser you are using tongue.gif
Maccabee
QUOTE(--DANNY-- @ Nov 21 2008, 06:25 AM) *
I would use <hr /> in place of <br />
and then adjust the height with:

<style type="text/css">
hr { height: 20px; }
</style>


... play around with the 20px value until you get the desired spacing.


Hr? Wouldnt that only work if it were invisible.

I dont think she wants to have a big line. just invisible space.
Mikeplyts
^I agree.
--DANNY--
QUOTE(JosephCohen123 @ Nov 21 2008, 01:41 PM) *
Hr? Wouldnt that only work if it were invisible.

I dont think she wants to have a big line. just invisible space.


Ahh , yes..
Well you can use border:none; but Internet Explorer is lame and doesn't let that work. It works in all other major browsers, Firefox, Google Chrome, Opera, etc.

Ya again, I'm used to working with mainly Firefox so I forget about the stupid little things here and there you have to find workarounds for to get them to work in IE.

If you wanted something that worked in all browsers, you could use:
<div class="hr"><hr/></div>

and do something like this...

<style type="text/css">
div.hr { height: 20px; }
div.hr hr { display: none; }
</style>


I dunno... usually this isn't an issue or need, because things are separated into paragraphs/sections with <p></p> and the bottom/top margin is set to adjust your spacing between sections/paragraphs/etc.
JackRapington
Thanks guys, must of been mistaken about the br thing in the first place. Thanks for all the suggestions that I probably should have though of. :D
fixtatik
a little late and whatnot, but if you still want to change the height of line-break tags, you can just change the height of the line:

br { line-height:##px; }
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.