How can I use a vw setting on a font but put a limit on how big it will expand to? Ex., through the break points I have it set on 1.60 vw but need to set the max width at a certain point.
Thanks
Byron
Variable font size
Byron Tipping wrote:
How can I use a vw setting on a font but put a limit on how big it will expand to? Ex., through the break points I have it set on 1.60 vw but need to set the max width at a certain point.
Thanks
Byron
How can I use a vw setting on a font but put a limit on how big it will expand to? Ex., through the break points I have it set on 1.60 vw but need to set the max width at a certain point.
Thanks
Byron
I'm guessing here as I don't have access to my computer at the moment but cannot one just set the maximum width to whatever you want it to be at that particular breakpoint ( in vw) then change the width to auto.
Sorry it's a bit vague but I can't check it out for an hour or two
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
Or even easier
Set the width to AUTO at all breakpoints
Then set the MAXIMUM width to the VW you require changing THAT as you move through the breakpoints
Set the width to AUTO at all breakpoints
Then set the MAXIMUM width to the VW you require changing THAT as you move through the breakpoints
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
If I have understood the original post correctly, it is wished to put a limit on the variable font-size one gets by using a vw setting.
One can set minimum and maximum sizes for fonts, and have a variable size between those minimum and maximum sizes. I think, however, that a vw setting is appropriate only for the variable size.*
SD allows easy conversion between, for example, vw and px. In the attached mobile-first project file I did the following to limit the font-size growth.
1. I set breakpoints at 340px and 960px.
2. I wanted the minimum font-size to be 16px, and set that for below the 340px breakpoint.
3. Exactly** at the 340px breakpoint I changed the font setting to vw, and SD automatically converted the 16px to 4.70vw.
4. I wanted the font-size not to continue growing once it got to the 960px breakpoint. Exactly at that breakpoint I therefore changed the font setting to px, and SD automatically converted the 4.70vw to 45px.
Frank
* A vw is, of course, a percentage of the visible width of the web page.
** I do this by clicking on 340px in the Toggle Breakpoints drop-down.
One can set minimum and maximum sizes for fonts, and have a variable size between those minimum and maximum sizes. I think, however, that a vw setting is appropriate only for the variable size.*
SD allows easy conversion between, for example, vw and px. In the attached mobile-first project file I did the following to limit the font-size growth.
1. I set breakpoints at 340px and 960px.
2. I wanted the minimum font-size to be 16px, and set that for below the 340px breakpoint.
3. Exactly** at the 340px breakpoint I changed the font setting to vw, and SD automatically converted the 16px to 4.70vw.
4. I wanted the font-size not to continue growing once it got to the 960px breakpoint. Exactly at that breakpoint I therefore changed the font setting to px, and SD automatically converted the 4.70vw to 45px.
Frank
* A vw is, of course, a percentage of the visible width of the web page.
** I do this by clicking on 340px in the Toggle Breakpoints drop-down.
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.