Viewport Sized Typography | CSS-Tricks


109 bookmarks. First posted by knilob may 2012.


웹 사이트의 크기에 따라서 폰트의 크기를 조절할 수 있어서 가독성을 최대화 할 수 있다.
dev-web  explicit  css  wordpress  codex  typography  font 
15 days ago by dildwild
I'd missed this before, but if using vw or vh units, then you'll need to trigger a re-paint if the window resizes:
from twitter_favs
november 2013 by jordanmoore
You'll at least want to provide a fallback:

h1 {
font-size: 36px; /* Some tweener fallback that doesn't look awful */
font-size: 5.4vw;
}
Testing for support
chrome  css  css3  typography 
august 2013 by usermac
WooHoo looking forward to using these - RT : have you heard of vh & vw units yet?
from twitter
august 2013 by kaelifa
Using the CSS3 viewport relative sizing units (vw, vh
attributes  elements  forms  html5  input  from instapaper
april 2013 by robbyedwards
Updated Viewport Sized Typography http://t.co/YhpZPv8KJW

Firefox 19+ and Safari 6+ supports now. Chrome/Safari still need repaint triggers.
from instapaper
april 2013 by oli
Updated Viewport Sized Typography

Firefox 19+ and Safari 6+ supports now. Chrome/Safari still need repaint triggers.
from twitter_favs
march 2013 by maccoy
Reminding myself how ace this is; Viewport Sized Typography by
from twitter
february 2013 by jt
Viewport Sized Typography: CSS vw, vh & vmin units for responsive font sizing
from twitter_favs
january 2013 by andydavies
CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin.
CSS  web_design 
january 2013 by decembr14
Responsive Typography with CSS3 for sizing things relative to the current viewport size
Webdesign  Typo  Responsive  CSS3 
october 2012 by Moghol
new font size unit based on viewport size
typography  css 
october 2012 by squiddisco
Finally in CSS3: how to specify sizes in terms of viewport size (height & width): use vh and vw as measurement units. Supported in Chrome 19+.

Took them ~15 years (CSS was first released in 1996). Idiots.
height  width  viewport  screen  relative  CSS  layout  design  web  webdesign  responsive  vw  vh 
july 2012 by dandv
CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it's shipping in Chrome 20 (canary at the time of this…
css  css3  typography  Web  from readability
june 2012 by lukelux
Have you seen this? There's a fix for Chrome 20:
from twitter
may 2012 by riklomas
viewport에 따라 글자 사이즈가 동적으로 변하는게 신기
하지만 브라우저가 지원하지 않으면 무용지물인 기능이긴 한데 브라우저 판올림되면 지원이 쉽게 될듯
css3  typography  chrome 
may 2012 by ncrash
CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it's shipping in Chrome 20 (canary at the time of this writing). And not behind a flag, it just works. Production usage isn't quite there, but it will be soon enough.
css3  typography  css  webdesign 
may 2012 by dlkinney
Display font sizes based upon the screen size. Don't get too excited about this, it's only in Chrome, and in beta at that.
css3  typography  responsive  browser  chrome  webdev 
may 2012 by jacklittleton
Viewport sized typography:
from twitter_favs
may 2012 by marks
More CSS Goodness => Viewport Sized Typography | CSS-Tricks
from twitter
may 2012 by graftedin
This is very welcome!
: Viewport sized typography: ”
from twitter
may 2012 by lucasalvini
responsive css3
may 2012 by emichaelb
Sometimes you'd like your typography to be somewhat related to the viewport size. In the near future you could use some new units just for that. <b>Chris Coyier</b> explains – in depth as always – how they work and more. You should read this.
typography  css3 
may 2012 by dailynerd
Viewport Sized Typography via
from twitter
may 2012 by jon_amar
Viewport Sized Typography
from twitter
may 2012 by viljami
a simple layout
typography  css3 
may 2012 by liamhodges
Viewport Sized Typography
from twitter
may 2012 by jackysee
Chris Coyier for CSS Tricks: “CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it's shipping in Chrome 20 […] And not behind a flag, it just works.”
tn91  typedia  typography  type  css  css3  viewport  size  sizing  resizing  browser  chrome  ie  ie10  chrome20  text  csstricks  chriscoyier 
may 2012 by splorp
Viewport Sized Typography
CSS  from twitter_favs
may 2012 by MrMartineau
sizing things relative to the current viewport size
typography  css  webdesign 
may 2012 by jshwlkr
ATTN web typography nerds. This is pretty important: Viewport Sized Typography | CSS-Tricks
from twitter
may 2012 by blindpiggy
Viewport Sized Typography: it's like FitText and CSS had a baby!
from twitter_favs
may 2012 by 43north
You should really check out @chriscoyier’s article+demo on viewport-relative typography: http://t.co/00XHuQKq /via @lyzadanger ~ User: https://twitter.com/RWD ~ Link: http://twitter.com/RWD/status/197341164259651585
ifttt  ☆twitter☆  @RWD 
may 2012 by benjaminparry