473,597 Members | 2,145 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Header. Font Size and Line Height

Hello,

I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html

Where Font Size is the same as Line Height: 2.0em.

Shouldn't the border be next to the text?

Thanks,
Miguel
Aug 18 '08 #1
6 3708
shapper wrote:
I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html

Where Font Size is the same as Line Height: 2.0em.
No, both are declared using the same expression, but it has different
meanings.

For font-size, the em unit means the size of the font of the parent element.
Shouldn't the border be next to the text?
Even if you set line-height to 1em, making it equal the font size, the
border does not normally touch letters. Remember that the font size is the
total height of the font, normally encompassing ascenders, descenders, and
diacritic marks. A letter like "H" should be expected to have a height that
is notably less than the font size.

Actually if the text contains letters like "j" and "Å", those letters might
extend to the border (set for an element with line-height: 1em) and even a
little beyond. But most letters - for the Latin script at least - have
spacing below and above them.

Yucca

Aug 18 '08 #2
On Aug 18, 7:07*pm, "Jukka K. Korpela" <jkorp...@cs.tu t.fiwrote:
shapper wrote:
I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html
Where Font Size is the same as Line Height: 2.0em.

No, both are declared using the same expression, but it has different
meanings.

For font-size, the em unit means the size of the font of the parent element.
Shouldn't the border be next to the text?

Even if you set line-height to 1em, making it equal the font size, the
border does not normally touch letters. Remember that the font size is the
total height of the font, normally encompassing ascenders, descenders, and
diacritic marks. A letter like "H" should be expected to have a height that
is notably less than the font size.

Actually if the text contains letters like "j" and "Å", those letters might
extend to the border (set for an element with line-height: 1em) and even a
little beyond. But most letters - for the Latin script at least - have
spacing below and above them.

Yucca
So should I use margin on a header to specify a top and bottom
spacing?

Thanks,
Miguel
Aug 18 '08 #3
shapper wrote:
So should I use margin on a header to specify a top and bottom
spacing?
Pardon? You quoted my entire message, so it is impossible to see how your
question relates to it and whether you understood any of it.

And taken in isolation, your question looks rather trivial. Spacing can be
achieved using margins or padding or both. What's so special here that you
need to ask?

Of course line-height can _also_ be used for spacing. What made you think it
could not? But it's not wise to use it for anything that can be achieved
using margin or padding, since line-height affects... well, line height,
i.e. _line_ spacing. This is quite important when the text may get divided
into two or more lines, as it usually can (there is no lower limit to window
width that people may use).

Yucca

Aug 18 '08 #4
In article
<06************ *************** *******@m45g200 0hsb.googlegrou ps.com>,
shapper <md*****@gmail. comwrote:
So should I use margin on a header to specify a top and bottom
spacing?
Use top and bottom padding.

--
dorayme
Aug 19 '08 #5
On 2008-08-19, dorayme <do************ @optusnet.com.a uwrote:
In article
<06*********** *************** ********@m45g20 00hsb.googlegro ups.com>,
shapper <md*****@gmail. comwrote:
>So should I use margin on a header to specify a top and bottom
spacing?

Use top and bottom padding.
I suppose on the assumption that he wants the spacing between the text
and the border.

But usually margins are a good choice because they collapse-- for
example bottom margin of H1 collapsing with top margin of the P that
follows it.
Aug 19 '08 #6
On Aug 19, 7:34*am, Ben C <spams...@spam. eggswrote:
On 2008-08-19, dorayme <doraymeRidT... @optusnet.com.a uwrote:
In article
<0639b2bc-5410-4696-a2d0-fdf1e82cb...@m4 5g2000hsb.googl egroups.com>,
*shapper <mdmo...@gmail. comwrote:
So should I use margin on a header to specify a top and bottom
spacing?
Use top and bottom padding.

I suppose on the assumption that he wants the spacing between the text
and the border.

But usually margins are a good choice because they collapse-- for
example bottom margin of H1 collapsing with top margin of the P that
follows it.
Thank You!

I will use margin ... the borders where just a visualization helper.

Miguel
Aug 19 '08 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
2938
by: Paul D. Sullivan | last post by:
I've been trying to find out how to increase the font size in the text entry fields in Invision Power Board 1.3 for a while. The part where you enter your post and do the quick reply and all that has a really small font by comparision to the display font in the forum, and I wanted to at least have the same size if possible. After some hours of working the issue, I tested about every relevant entry in the Style Sheet. I found one line...
4
4939
by: Eric Eggermann | last post by:
Hello all, I'm building an app that lays out and prints flash cards. Now the card might be any size, but when the user is working on the card, I draw the preview isotropically, as large as possible. The user specifies a font size for the document, but I need to scale this for the preview. The scaling code I have is very close but not right. I can only notice that it's wrong occasionally when I have a piece of text that wraps, and the...
9
19516
by: Adam | last post by:
Can someone please help!! I am trying to figure out what a font is? Assume I am working with a fixed font say Courier 10 point font Question 1: What does this mean 10 point font Question 2: How do I determine how many characters I can get on a line Question 3: How do I determine how many lines I can get on a page. Assume no margins Question 4: Does their exist some kind of refernce table that will equate a font with chars/line and...
11
8318
by: Peter Wu | last post by:
Hello, I want to create a Header and Footer for every ASPX page I build. I created 2 Web user controls respectively and placed them in an ASPX page. The problem is that I cannot position the Footer to be always at the bottom of the page. The Header and Footer are always together at the top of the page. Was I missing anything? Thanks!
16
2445
by: maya | last post by:
I have heard so much preaching here about how font sizes should be set as percentages so users can change font-sizes on their browsers... ok, so now at work am working on a site where we need to do precisely that b/c it's for an audience that some users maybe be visually-impaired.. but I can't get it to work right, problem is that font sizes are not consistent across diff elements.. code: body {text-align:center; /* to center...
3
4299
by: guitar | last post by:
Hi, I have created a table, which has a stable header and a scroller for data. One of my data field has a combo box... Everything works fine but the combo moves over the header when scrolled... Can anyone help me out? The code is... <HTML> <DIV style="width: 180 px;height:200 px;overflow:scroll">
1
19659
by: swc76801 | last post by:
I desperately need help. My understanding of CSS is non-existent. I have a store http://astore.amazon.com/texasheat-20 with Amazon.com. According to the information from Amazon.com "Write your own overriding CSS to customize your aStore." Their setup page is divided into two sections. On the right they show the existing CSS. On the left there is a box where you can add the new code. They have tabs for "Global", "Category Page", "Detail Page",...
1
2778
by: Desser | last post by:
CSS Newbee. I need to have lesser space between the h1 and the paragraph text. My header is 28 pixels and the body text is 12 pixels. How do I do this? Here is my CSS:
3
5509
by: Noorain | last post by:
I designed a site. i want to header,footer,left & right column fixed but body information only scrolling. this site screen to be 800/600 px. i designed this way but when i used position fixed all information to show as displace. please help me. my coding are as below: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>...
0
8271
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
8380
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
6686
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
5847
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
3881
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
3923
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
2399
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
1
1493
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
1231
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.