Skip to main content
E
English100
Inspiring
November 14, 2019
Answered

Font Not Behaving

  • November 14, 2019
  • 1 reply
  • 1358 views

I write stories and post them on my website. To avoid any formatting being brought over from my WP app Pages, I copy and paste the text into plain TextEdit then copy and paste into DW. The text defaults to stylestory from my sytlesheet. I have another font defined by stylechapter with the text-align set at center.

 

Sometimes when I highlight say Chapter One and select the stylechapter it aligns left and that is caused by the preceeding style.

The code looks like this:

<p class="stylestory"><span class="stylechapter">Chapter One</span></p>

If I remove <p class="stylestory"> then the font aligns correctly at center. Its a RPITA to go ahead and remove the preceeding font code for all the instances of Chapter. The same happens with the font styleasterisk.

 

Any idea why DW is doing this?

Thanks

Alan

This topic has been closed for replies.
Correct answer Jon Fritz

Yep, looks you have an issue in your code.


DW allows you to do things "the wrong way" maybe assuming there's going to be a script added at some point that takes care of the problem, who knows, but it allows for all sorts of "wrong" to happen within the interface.

That could be something simple like a missing ; or { in your CSS to a <table> tag in your <head> section and a whole lot more.

The point is, without seeing the code, we can only make guesses based on the very limited info we've been given. 

Right now, I would guess you have an extra or missing <span> or </span> somewhere, possibly before the section you've provided screen captures of. Have you run your code through the validatros to fix any errors you might have...

HTML: https://validator.w3.org/nu/
CSS: https://jigsaw.w3.org/css-validator/

1 reply

Jon Fritz
Community Expert
Jon FritzCommunity Expert
Community Expert
November 14, 2019

Could you post a link to your site so the contributors here can take a look?

Chances are good it's a combination of both the way the code is written, and the process you're using to update, that are causing your issue. I'm guessing your styles may be applied to elements that are accidentally being replaced when you paste into your pages, but it's hard to say without seeing exactly what's going on.

    E
    English100Author
    Inspiring
    November 14, 2019

    Jon

    The code is generated by DW. To me it's a simple fact is that the style of the font is being taken from stylestory because it displays fine, but the alignment is being taken from the default stylestory that stylechapter is supposed to overwrite. Is it normal for the overwritten code to remail in the code string? Linking to my website won't help because the code is no different to what I see in DW. The issue is that DW is somehow retaining the alignment from the overwrittne font style. I should add that this isnt always the case. Look at the screen shots. The first is the code, the second is Design View and the third is Live View but it's not what is displayed on the webpage - the Design View is what's displayed.

    Alan

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    November 15, 2019

    Nancy

    That code <span class="stylechapter"> is generated by DW. I highlight the text 'Chapter One' and select stylechapter from the CSS dropdown list. Yes, I tried the code <h3 class="stylechapter">Chapter One</h3> buy don't know how format it. I have this code in my CSS:

     

       Heading h1 {
    font-family: "quicksand", sans-serif;
    font-size: 18px;
    color: #983200;
    text-align: center;
    font-weight: 400;
    letter-spacing: 5px;
    font-style: normal;
    }
    but when I highlight Chapter One and select Heading 1 from the dropdown list under Format, the font defaulats to this Chapter One instead of the font specified in my CSS.
    Thanks
    Alan
     
    Jon
    The HTML document is a template and all my stories use the same format and Im not having the alignment issue in others. When I highlight the text and select the CSS style, it aligns center as it's supposed to. Here are the errors after running the document throught the checker and I've no idea what to  make of it. No errors in my CSS.
    Thanks
    Alan
     

     

     


    I see a selector naming problem.   Heading is neither a class prefixed by a dot nor an  ID prefixed by a #.  So delete it.

     

    Heading h1 {
    font-family: "quicksand", sans-serif;
    font-size: 18px;
    color: #983200;
    text-align: center;
    font-weight: 400;
    letter-spacing: 5px;
    font-style: normal;
    }

    <h1>Chatpter One</h1>

     

     

    Nancy O'Shea— Product User & Community Expert
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices