Skip navigation
mixmasterdsr04
Currently Being Moderated

Can't see CSS Styles applied to HTML document

Jan 28, 2013 8:19 PM

Hi, any help with this issue would be greatly appreciated

 

I've set up a new HTML document and have applied various CSS classes to the text, which I can see in Dreamweaver. The trouble is that when I preview in the browser, or try a LIVE preview, the styles go away. Basically the method for creating the styles was to create new CSS rule from the CSS palette, and select Class, name the class and apply the styling. The font I'm using is Roboto, which is the default font for Android, which I have installed. Again I can see the text styling in Dreamweaver just not in the browser.

 
Replies
  • Currently Being Moderated
    Jan 28, 2013 8:35 PM   in reply to mixmasterdsr04

    Dear Sir/Madam,

     

    The answer lies in your markup and at this stage you are but we are not privy to.

     

    To start with, Roboto may be the default for Andriod, but it certainly is not for the OS that I use. Hence this font will not be shown on my system.

     

    But you speak of other style rules that are not being recognised.

     

    To save a lot of to-ing and fro-ing, please supply a link to your site.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 28, 2013 10:48 PM   in reply to mixmasterdsr04

    Add the highlighted line and change the style rules as follows

    <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>

    <style type="text/css">

    .PrimaryHeading {

       font: 600 16px/28px 'Roboto', sans-serif;

        color: #333333;

        padding-top: 0%;

        padding-right: 0%;

        padding-bottom: 0%;

        padding-left: 0%;

    }

    .BodyCopy {

        color: #333;

       font: 400 normal 12px/18px 'Roboto', sans-serif;

    }

    .ImageAlign {

        float: right;

    }

    .BodyCopyItaLIC {

        font: italic normal 12px/normal 'Roboto', sans-serif;

    }

    .BodyCopyBold {

       font: 900 normal 12px 'Roboto', sans-serif;

        color: #333;

    }

    </style>

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 29, 2013 8:41 AM   in reply to mixmasterdsr04

    I rarely use the CSS editor in DW because it doesn't fully support CSS3, vendor-specific prefixes (-moz, -webkit) or custom web fonts.  Being able to work directly with code will save you a good deal of time.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 29, 2013 8:55 AM   in reply to mixmasterdsr04

    Despite what you may have been led to believe, basic coding skills are an essential part of working with DW.  You can use the CSS editor if you wish, but you won't be able to do advanced things without some coding skills.

     

    If code isn't your thing, maybe you should use a different web authoring tool like Muse.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 29, 2013 9:20 AM   in reply to mixmasterdsr04

    98% of browser display issues cause by code errors.  Are you validating your HTML & CSS code to ensure there are no errors in it?

     

    Code validation tools

    http://jigsaw.w3.org/css-validator/

    http://validator.w3.org/

     

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 29, 2013 3:07 PM   in reply to mixmasterdsr04

    I did use DW to do the above.

     

    The main difference between what you had and the suggested version is the reference to the Google web fonts library. Each time the page is opened, a call is made to Google to retrieve the fonts.

     

    Another difference is the way that the fonts have heen styled. If you go to Google web fonts, you will be shown how to do this.

     

    Glad it works.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points