How can I do this in as little...

User 404575 Photo


Registered User
887 posts

Hi gang! Been awhile since I came by. :)

Hope you all are well and bright eyed and bushy tailed.

Just had a quick code question. At http://ColoradoProcessServers.net
I have:

<h1>Colorado Process Servers&#x2122;<br>
dba<br>
Denver Process Servers&#x2122;
</h1>

but it's taking up too much space vertically and pushing white space below the logos on the left because of it.

The dba is much of the problem. I'd like to make it in much smaller text, but to do that, I'd have to enclose the two company names in H1 tags, which then adds enormous space above and below them.

I actually wish I could get rid of the excess space above and below H-tagged items, but don't know of a way to do that either. Is there one?

But what would be the best way to tackle this, please?
Melissa Rhiannon
OS Windows 10
User 122279 Photo


Senior Advisor
14,648 posts
Online Now

How about taking the uppermost text from the right column and place it either below or above the logos? Then there would be less content on the right, and you could fill out the empty space in your main column.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2073552 Photo


Registered User
1,625 posts

Melissa Brookstone wrote:
Hi gang! Been awhile since I came by. :)

Hope you all are well and bright eyed and bushy tailed.

Just had a quick code question. At http://ColoradoProcessServers.net
I have:

<h1>Colorado Process Servers&#x2122;<br>
dba<br>
Denver Process Servers&#x2122;
</h1>

but it's taking up too much space vertically and pushing white space below the logos on the left because of it.

The dba is much of the problem. I'd like to make it in much smaller text, but to do that, I'd have to enclose the two company names in H1 tags, which then adds enormous space above and below them.

I actually wish I could get rid of the excess space above and below H-tagged items, but don't know of a way to do that either. Is there one?

But what would be the best way to tackle this, please?


Add line-height: 13px; to your H3 tag and that should take care of your problem.
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 404575 Photo


Registered User
887 posts

Thanks Adam, but should it be made smaller than the font size like that? Wont screw anything up?

I just made it the same as the font size and it seems to have worked out, and looks better. Trying that as a fix to the H1 tags too...

Also tried the same on the P tag too. How's it look now?
http://ColoradoProcessServers.net

:)

Melissa Rhiannon
OS Windows 10
User 2073552 Photo


Registered User
1,625 posts

Melissa Brookstone wrote:
Thanks Adam, but should it be made smaller than the font size like that? Wont screw anything up?

I just made it the same as the font size and it seems to have worked out, and looks better. Trying that as a fix to the H1 tags too...

Also tried the same on the P tag too. How's it look now?
http://ColoradoProcessServers.net

:)



Looks better. But I would suggest a better font or maybe think about changing the color of the font. It does strain the eyes a bit.
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 404575 Photo


Registered User
887 posts

Arial is supposed to be the easiest font on the eyes, Adam, that's why I used it.

The color was toned down, from when I had it too bright in the past.

Melissa Rhiannon
OS Windows 10
User 38401 Photo


Senior Advisor
10,951 posts

I would agree with Adam that the font isn't quite right, but I don't think it's the color I think it's that you have 90% of your website in bold and that makes it harder to read not easier. Try unbolding your main content (right side) and only bold a few key phrases you want to emphasize. Always looks better than all bold.
User 404575 Photo


Registered User
887 posts

Interesting. Does anyone else agree?

Yeah, looking at my style.css, all the text IS bold. But I wanted a bold website.

Hmmm...

And I'm not sure how to set up the H tags any differently. I wish they had more H tags to allow more variety with things like this, but I think they only go up to H6 or something.
Melissa Rhiannon
OS Windows 10
User 122279 Photo


Senior Advisor
14,648 posts
Online Now

I agree with Jo Ann on the bold thingy. You could remove font-weight: bold; from the p tag.

If you are using H tags, they will automatically be bold. I would rather say they go 'down' to h6, as they get smaller and smaller. But the size can of course be set in the css file.

Also, I must congratulate you to having made the change from WP to a normal html site created with HTML Editor. ;) You won't be so 'locked into' some design any more.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 404575 Photo


Registered User
887 posts

Oh yeah, and thanks Inger. I much prefer doing my own thing without WP. :P
Melissa Rhiannon
OS Windows 10

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.