responsive text box - MUSE

[mh87161772]

I am having an issue where my text is scaling to a point that is too small to read on mobile/tablet devices. If I choose not to scale the text, it just gets cut off the page.

Is there a way to set the text box to scale (grow in height / shrink in width) where the text size remains the same?

[Preran]

This is an old discussion on the same topic, but you may find alternative solutions that will probably work for you.

Muse responsive text field?

Thanks,

Preran

[Günter Heißenbüttel · Accepted solution]

mh87161772  schrieb

Is there a way to set the text box to scale (grow in height / shrink in width) where the text size remains the same?

But this is the standard behaviour of text boxes! Text normally doesn't scale, but the text container can scale horizontally and grow vertically.

I think, your problem is, that you are using a system font and not a standard font or a web font. In this case, text has to be converted to an image, because Muse can't make sure, that this font is installed of your visitor's machines. In consequence, the rasterized text is behaving like an image and scales, when the browser window is scaled.

[LeoSan]

I'm having the same issue and using Adobe type kit.
Any tips?

[Günter Heißenbüttel]

Please describe your problem exactly. The initial poster has the problem, that text scales down on smaller devices/window sizes. This inevitably happens, when using system fonts, which have to be converted to an image. (Nobody can guarantee, that these fonts are installed on every visitor‘s computer.)

You say, that you are using web fonts. In this case, text won‘t scale down, but the text box has to grow vertically to keep the complete text visible.

So, what exactly is your issue?

[LeoSan]

Solution:

To scale fonts to 1:1 across all devices and platforms. Paste into header.

<meta name="viewport" content="width=device-width, initial-scale=1">

Thanks for asking Günter!

[Günter Heißenbüttel]

No idea, what you want to achieve with this snippet of code. This is performed by Muse automatically.

[LeoSan]

Iphone vertical and horizontal views were not displaying the web font at 1:1 so I needed to specify it to.

The vertical mobile view for the web font was way too small. The horizontal view was fine.

This is the code that solved my problem as Muse wasn't achieving consistent font sizes.

Anyway, issue solved. Thanks for asking!

[Günter Heißenbüttel]

Did you create an adaptive site? If yes, you should tell us! (Adaptive pages use viewport scaling on purpose.)

With responsive pages the code, you are talking about, is provided by Muse “out of the box“.