Questions tagged [line-height]
64 questions
3
votes
2 answers
Is line-height: 1.4 the same as line-height: 140%?
Is using a line-height value of 1.4 the same as using a line-height value of 140%? In other words, can we consider unitless value the same as percentage value?
JKK
- 109
- 2
- 7
2
votes
2 answers
why `font-size` isn't equal to the `height`? so in the right if the is 2rem, on the right I can have 2 small s of 1rem each one
how can I do a layout like this?
basically,
I have 2 containers in flexbox:
first one with text "33"
the second one is a grid container:
the first one in the grid is "EUR"
the second one in the grid is ".49"
so with this description, I…
stackdeveloper
- 352
- 2
- 21
2
votes
1 answer
CSSStyleDeclaration not giving any value while using useRef in react
I want to get the line-height of the element in Rect after render and for this I'm using useRef
const titleLineHeight = titletext.current?.style.lineHeight;
and I didn't get any value in CSSStyleDeclaration
Im not sure how to get the values.…
Kamal
- 2,140
- 8
- 33
- 61
2
votes
1 answer
Why doesn't reducing line-height reduce (click) area?
I'm working on a personal project to have thumbnails for images that you can scroll through and click to set the main image. I noticed an odd thing happening.
I re-created the issue in a Stackblitz project here…
ScubaSteve
- 7,724
- 8
- 52
- 65
2
votes
1 answer
CSS line height does not go all the way up or down
I have a problem that I've had for years.
A text with line-height: 1 will be compact and will reach the top and bottom of the surrounding elements.
A text with another line-height will be more readable but at the same time, it will no longer reach…
Jens Törnell
- 23,180
- 45
- 124
- 206
2
votes
1 answer
How can I vertically center text within flexbox when each line-height is different?
I have three text section horizontally and each text has different line-height. But, they should be vertically aligned.
div {
display: flex;
align-items: center;
width: 300px;
background-color: skyblue;
}
p {
font-size: 20px;
…
undefined
- 978
- 1
- 12
- 30
2
votes
1 answer
Using line-height: 100% is staggering the elements instead of making them match in height
My apologies if this is difficult to follow.
I am challenging myself to use only CSS and HTML to build this site in order to improve my skills with CSS. I have hit a road block with two rows that contain three "card" elements each. The cards are all…
Tessa
- 23
- 4
1
vote
0 answers
React native Android 12(31), 13(33) text align in lineHeight different
React Natvie component has different text align in their lineHeight area when Android os
under 12, 13
This is 13(33)
This is 12(31)
Anyone know reason? font? os?
Use "NotoSansKR" Font
Please Answer anyone know
style code
filterName: {
…
user20821745
- 31
- 1
1
vote
1 answer
How to deal with a font that is "larger" than its own characters
I'm using a font called Fugaz One through @fontsource. When I put it into an H1, it renders fine. However, the resultant text elements it creates are significantly too tall. If I set the css property line-height:100% it renders alongside other text…
jemhop
- 51
- 3
1
vote
0 answers
Set line height in the
tag - JSX element
I know the standard HTML for how to set line-height
in the
tag, but in the react JSX elements, I am not sure how to set it. Below is the code I've tried, but it doesn't increase the height. I want actual results…
in the
tag, but in the react JSX elements, I am not sure how to set it. Below is the code I've tried, but it doesn't increase the height. I want actual results…
Fatt Sky
- 650
- 3
- 11
1
vote
1 answer
1
vote
1 answer
How to vertically center a 200px font-size lowercase 'x' in a div?
How to vertically center a 200px font-size lowercase letter ('x' in this example) in a div ?
-- plz don't redirect me to a 'center a div inside a div' solution... it's not the same question at all...
I'v tried a couple of ways, but all solutions…
alexalex25
- 33
- 6
1
vote
0 answers
How do we set a custom line height in a TextView?
I am working on a custom TextView where we are highlighting certain words in the String with a green background drawable. The drawable is dependent on the line height for the word it is highlighting and will draw itself according to the top and…
Calvin Rai
- 816
- 1
- 8
- 17
1
vote
1 answer
How does {all: initial} work? Problem with default values
Why does paragraph inherit properties from div such as:
line-height and text-align.
If values for these properties are:
normal -> for line-height
[i.e. font-size = 16px (initial / default value) * normal (value is
usually around 1.2 -> 19.2…
Add3r
- 11
- 2
1
vote
1 answer
How to get the height of each line in edit text
I want to animate the keyboard when a new line is added or removed just like how telegram does. I am able to add the animation like this:
private void doAnimation(int linesCount, String s){
Toast.makeText(this, "" + linesCount,…
Sambhav Khandelwal
- 3,585
- 2
- 7
- 38