Highlighted

Font issue

New Here ,
Mar 30, 2020

Copy link to clipboard

Copied

Hi all,

 

I'm brandnew to Dreamweaver, HTML and CSS, but the tutorial videos have already helped me al lot. I continued from the websited Adobe made to show you around in the videos, but there's one thing that doesn't really work: the fonts. Whatever font(family) I choose in DW, it looks the same in the browser preview. I know about the possible issues about fonts that might not be installed etc, but I don't think that's the problem. I read something about java but I have no idea where to begin. Unfortunately I can't link to the website since it hasen't been published yet.

Views

52

Likes

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

Font issue

New Here ,
Mar 30, 2020

Copy link to clipboard

Copied

Hi all,

 

I'm brandnew to Dreamweaver, HTML and CSS, but the tutorial videos have already helped me al lot. I continued from the websited Adobe made to show you around in the videos, but there's one thing that doesn't really work: the fonts. Whatever font(family) I choose in DW, it looks the same in the browser preview. I know about the possible issues about fonts that might not be installed etc, but I don't think that's the problem. I read something about java but I have no idea where to begin. Unfortunately I can't link to the website since it hasen't been published yet.

Views

53

Likes

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
Mar 30, 2020 0
Adobe Community Professional ,
Mar 30, 2020

Copy link to clipboard

Copied

Are you using fonts from the CSS Font-stack, your computer or are you using fonts hosted on 3rd party websites like Google or Adobe Fonts (formerly Typekit)?

 

It goes without saying, you must get permission to use Adobe Fonts. That permission comes from a) having a Creative Cloud Plan and b) activating the fonts and using the <embed> code they provide on the Adobe Fonts web site.

 

In this example, I'm using Azote from My Fonts folder on Adobe Fonts. 

https://fonts.adobe.com/my_fonts

 

Here is my HTML and CSS code.  I used a common font-stack for routine text and a special web font in my <h3> tag.  I am able to see both fonts in Live View and when previewed in browsers.

 

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Adobe Fonts -- Azote Font Test</title><meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Adobe Fonts, Azote-->
<link rel="stylesheet" href="https://use.typekit.net/qzq1elx.css">
<style>
/**Some custom CSS**/
body {
width:80%;
margin:0 auto;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size:1rem;
}
h3 {
font-family: azote, serif;
font-weight: 400;
font-style: normal;
font-size: 2.5rem;
}
</style>
</head>

<body>
<h3>Azote Font Test</h3>
<p>This is Gill Sans. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo quidem iusto quis mollitia impedit asperiores, neque quod, quia, officiis modi assumenda repellendus consequuntur animi aliquid consequatur est eaque cuma minima?</p>
</body>
</html>

 

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

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
Reply
Loading...
Mar 30, 2020 0
New Here ,
Mar 31, 2020

Copy link to clipboard

Copied

Hello Nancy, thank you for your answer. Actually I'm just trying to use the fonts that are in the pop-up window when adding font-family, I guess that's what you mean by the CSS-font stack?

I tried your code as a new HTML document and it works. When I try the CSS fonts stack it works in browser preview (I'm pretty shure yesterdays it didn't), but when I publish it just stays the same font. At first I thought there was a sync issue but other style elements are updated so that's not the problem.

Not sure this might be helpful but here's the link http://vzwuitmuntend.epizy.com/vzw%20uitMuntend%20test.html.

Please don't pay too much attention to it, it's only for training purposes 🙂

And yes I have a Creative Cloud plan, but I'll try them after I get over this issue, unless you tell me it's better to use it instead.

 

Thanks for your help!

Likes

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
Reply
Loading...
Mar 31, 2020 0
Adobe Community Professional ,
Mar 31, 2020

Copy link to clipboard

Copied

Fix your code errors. Remove the opening and closing <strong> tags from lines 1 and 101.

https://validator.w3.org/nu/?doc=http%3A%2F%2Fvzwuitmuntend.epizy.com%2Fvzw%2520uitMuntend%2520test....

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

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
Reply
Loading...
Mar 31, 2020 0