CSS question #2 - Post ID 84801

May 31st, 2009 at 03:48 AM
User 1892988 Photo

Dick Rikkengaa
Registered User
151 posts

In VSD I added a HTML tool to do some CSS scripting.

The following is in the header section:
<style type="text/css">
p.main {text-align:justify;
font-family: Arial;
font-size:14px;
color:grey}

p.sub {text-align:left;
font-family: Arial;
font-size:16px;
color:yellow;
font-weight:bold}
</style>


The following in the body section:
<p class="main">There are many very...
<p class="sub">My vision:
<p class="main">I like those pictures...
<p class="sub">Who do I look for?
<p class="main">Basically I'm looking for...


Attached to results.

The thing is that between the yellow label (sub class) and the main text (main class) do have an empty line while the
<br />
is not used.

How can I remove that line?
Attachments:
HTML Editor, Visual Site Designer, Web Form Builder, Picture Gallery, Fire Starter,
News Reader, Web Access Manager, Password Wizard

asaruba.com
beholdmyvision.com
May 31st, 2009 at 05:11 AM
User 463058 Photo

Cary
Ambassador
1,086 posts
Online Now

That space is due to the browser's default paragraph margin. You can do something like this to reduce it:

<style type="text/css">
p.main {
text-align:justify;
font-family: Arial;
font-size:14px;
color:grey;
margin-bottom:10px; /* or whatever size spacing you want */
}

p.sub {
text-align:left;
font-family: Arial;
font-size:16px;
color:yellow;
font-weight:bold;
margin-top:0;
}
</style>
May 31st, 2009 at 05:26 AM
User 1892988 Photo

Dick Rikkengaa
Registered User
151 posts

YES! Thank you so much!

margin-top:0 in p.main did the trick.

:D
HTML Editor, Visual Site Designer, Web Form Builder, Picture Gallery, Fire Starter,
News Reader, Web Access Manager, Password Wizard

asaruba.com
beholdmyvision.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.