• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Synchronized Text not retaining style across breakpoints

New Here ,
Oct 19, 2020 Oct 19, 2020

Copy link to clipboard

Copied

My problem is simple: I want to change text size in diferent breakpoints, but for some reason while using Synchronized Text all the texts in all breakpoints retain the same size.

 

I made sure to click Format text on current breakpoint button, cheacked that I am workin on the normal status and I even made a new text frame to test the Synchronized Text.

 

Nothing worked and it's DRIVING ME CRAZYChanging the text size in one breakpoint changes it in all breakpoints.

 

What am I doing wrong?

01.jpg02.jpg03.jpg

 

TOPICS
Bugs , Error , How to , Product issue

Views

103

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 19, 2020 Oct 19, 2020

Copy link to clipboard

Copied

LATEST

Muse is discontinued & unsupported.  You shouldn't be using it for new projects.

 

Scalable fonts are nothing complicated with HTML & CSS code.  As an example, copy & paste this into a plain text editor (not Muse) and save as text.html.  View in your browser and resize the handles to see what happens.  NOTE: No breakpoints (aka CSS media queries) were used here.

 

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Rescale Fonts to Fit Any Screen Size</title>

<style>
body {
background:#000 url(https://placeimg.com/900/900/arch) no-repeat center center fixed;
background-size:cover;
font-family: 
Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
font-size: calc(16px + 1vw);
line-height: calc(1.1em + 0.5vw);
}
.container {
width:80%;
margin:0 auto;
background:rgba(0,0,0,0.5);
padding:2% 4%;
color:#FFF;
}

</style>
</head>
<body>
<div class="container">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur nostrum similique, dolores enim quam provident, deserunt tempora molestias. Nisi laboriosam quam dolor, officia magni error? Sint nihil dolore debitis doloremque.</p>
</div>
</body>
</html>

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines