Announcement

Collapse
No announcement yet.

My CSS is not applying correctly :

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    My CSS is not applying correctly :

    I wanted to overide Actinics default font; size, and family used for LINKS.

    After advice from this forum i set myself up with a set of statements in my actinic.css;
    HTML Code:
    a.mylink.link{
    color:NETQUOTEVAR:LINKCOLORCSS;
    font-size:6pt;
    text-decoration:none;
    }
    
    a.mylink.visited{
    color:NETQUOTEVAR:VLINKCOLORCSS;
    font-size:6pt;
    text-decoration:none;
    }
    
    a.mylink.hover{
    color:NETQUOTEVAR:HLINKCOLORCSS;
    font-size:6pt;
    text-decoration:none;
    }
    
    a.mylink.active{
    color:NETQUOTEVAR:ALINKCOLORCSS;
    font-size:6pt;
    text-decoration:none;
    }
    As you can see the font is very small.

    I call the CSS style as follows;
    HTML Code:
    <td class="mylink" valign="top"><div align="left"><a href="CUSTOMVAR:AD1LINK">CUSTOMVAR:AD1TEXT</a></div></td
    but this does not seem to have any effect on the font style. So I am resorting to doing this every time a link font is called.

    HTML Code:
    <td valign="top"><div align="left"><a href="CUSTOMVAR:AD1LINK"><font color="#000000" size="1">CUSTOMVAR:AD1TEXT</font></a></div></td>
    Why isn't my CSS working properly ?

    Simon.
    esafetysigns.co.uk
    your instant download portal for self printable health and safety signs and posters
    ... download once use as many times as you like !


    http://www.esafetysigns.co.uk/index.html
    http://www.esafetysigns.co.uk/acatalog/index.html

    #2
    You are styling the <td> property ... you need to style the <a> tag eg:

    <a class="mylink" href=" ........


    Bikster
    SellerDeck Designs and Responsive Themes

    Comment


      #3
      ^^ what he said....

      plus....

      font size in pt, is "usually" for print rather than screen,, there are strong arguments for use of relative font sizing or pixel sizing for screen. Still, dont think it matters this much at this stage.

      If you're delving into beginners CSS, then can I recommend this 'ere link

      http://www.w3schools.com/css/css_intro.asp

      Comment


        #4
        Done the mods ?

        Done some mods as suggested and still the original CSS properties for LINKs is applying.

        I know this because i changed these and my page changed accordingly?

        For some reason the class="mylink" is not working.
        HTML Code:
        <td><div align="center"><a class="mylink" href="CUSTOMVAR:AD1LINK"><img src="CUSTOMVAR:AD1IMAGE" border="0"></a></div></td>
        I played around with changing between 6pt and xxx-small, this works for the original LINK properties but not mine ?

        Simon ??
        esafetysigns.co.uk
        your instant download portal for self printable health and safety signs and posters
        ... download once use as many times as you like !


        http://www.esafetysigns.co.uk/index.html
        http://www.esafetysigns.co.uk/acatalog/index.html

        Comment


          #5
          Code:
          <td>
          <div align="center">
          <a class="mylink" href="CUSTOMVAR:AD1LINK">
          <img src="CUSTOMVAR:AD1IMAGE" border="0">
          </a>
          </div>
          </td>

          but there is no text withing that a link.. only an image? so how can a text styling be applied to an image?

          Comment


            #6
            try setting your CSS to:

            .mylink a:link
            .mylink a:visited
            .mylink a:hover
            .mylink a:active


            Bikster
            SellerDeck Designs and Responsive Themes

            Comment


              #7
              Originally posted by Hatticus
              but there is no text withing that a link.. only an image? so how can a text styling be applied to an image?
              The OP had a text link ... the later posts have an image ... which are you adding it to Simon?


              Bikster
              SellerDeck Designs and Responsive Themes

              Comment


                #8
                Sorry copied the wrong line ....

                Yep, stupid me, copied the wrong line, bit i am applying the CSS as follows
                HTML Code:
                <td valign="top"><div align="left"><a class="mylink" href="CUSTOMVAR:AD1LINK">CUSTOMVAR:AD1TEXT</a></div></td>
                Ok, some other stuff to consider. Changed to

                .mylink a:link
                .mylink a:visited
                .mylink a:hover
                .mylink a:active

                mylink is now visible in the DWeaver CSS Styles window, so is identified as OK.

                To try and diagnose, i changed class="mylink to class="actregular" and DWeaver sees the change and my Design View shoes a change in font size and style.

                However, Actinic does not and still applies the original styles, becasue if I change these as follows, the change is immediate in Actinic.

                So mylink is not overriding the following in Actinic

                HTML Code:
                a:link{
                color:NETQUOTEVAR:LINKCOLORCSS;
                font-size:x-small;
                text-decoration:none;
                }
                
                a:visited{
                color:NETQUOTEVAR:VLINKCOLORCSS;
                font-size:x-small;
                text-decoration:none;
                }
                
                a:hover{
                color:NETQUOTEVAR:HLINKCOLORCSS;
                font-size:x-small;
                text-decoration:none;
                }
                
                a:active{
                color:NETQUOTEVAR:ALINKCOLORCSS;
                font-size:x-small;
                text-decoration:none;
                }
                Any ideas, Simon ?
                esafetysigns.co.uk
                your instant download portal for self printable health and safety signs and posters
                ... download once use as many times as you like !


                http://www.esafetysigns.co.uk/index.html
                http://www.esafetysigns.co.uk/acatalog/index.html

                Comment


                  #9
                  are you aware that a lot of people will not be able to read 6px

                  Comment


                    #10
                    what is the content of your CUSTOMVAR:AD1TEXT ?


                    does this contain any HTML relating to styling?

                    and yep.. re 6px size...

                    Again, strong arguments for and against forcing font size on users computer screens. Thank gawd for firefox thats all I can say.. no matter what size they "thinik" you should view their font at it is always possible to over ride.

                    I would say, that if you are going to try and force a size for users with IE only etc. , then use a size that is readable at 1024 x 768 resolution and does not look rubbish at 600x800. Remember that there are a LOT of people out there who have to wear glasses... and if your site is too difficult for them to read, they can quite easily click another link and wander off

                    Comment


                      #11
                      Ok what about the following ....

                      CUSTOMVAR:AD1TEXT contains

                      Get the lot with the mandatory signs suite.<br /><br />With over 80 sign designs, and 25 templates this is the most economical way to buy your mandatory safety signs. <br /><br />Find out more ...
                      OK, I'll take on board the points on font and I do often preview in 800x600 and 1024x768, to see how readable it is however I haven't checked the readability with a glasses wearer...... I'll give my gran a call, (ha).

                      Do you notice how blurrry things get when you view at 800x600. I develop at 1280x1024 and hate checking the site at other resolutions, as the quality goes out the window. I am using an Ultrasharp LCD 19", and a bit spoilt I suppose.

                      Simon.
                      esafetysigns.co.uk
                      your instant download portal for self printable health and safety signs and posters
                      ... download once use as many times as you like !


                      http://www.esafetysigns.co.uk/index.html
                      http://www.esafetysigns.co.uk/acatalog/index.html

                      Comment


                        #12
                        I develop at 1280x1024 and hate checking the site at other resolutions, as the quality goes out the window.
                        who are you building the site for - yourself or others.

                        You need to think user....

                        if you are selling really trendy gear to the younger market you can afford to use a smaller font, but if your target is the elderly you need to think 14px, 100%, medium, size 3 etc. Even with this scenerio you will alienate potential buyers.

                        Comment


                          #13
                          consider this..

                          http://www.w3schools.com/browsers/browsers_stats.asp

                          now.. these are the statistics for the people viewing that particular site....
                          .... a website for people with an interest for web technologies.

                          In this case, 75% users are viewing at either 1024x768 or 800x600 .
                          Of course, the particular type of people potentially viewing your site may be of a different user group. Yet, I would say, the first part of designing your site is not to put people off, THEN get round to selling them something

                          Good luck though.. looks like you're getting well into it!

                          Comment


                            #14
                            oh.. and re your question about css etc.. answer = dunno, need more info a link to your site maybe so we can view source code.. and a copy of your css that is being applied ?

                            Comment


                              #15
                              Wicked stats ......

                              Thanks for the advice and the link to the stats.

                              Out of interest I have been using catalogue sites as a point of inspiration. If you go to www.britishcatalogues.co.uk you will get a link to the top 10 or so UK retailers and their online catalogues.

                              However, nothing is hard and fast yet, and my site layout is flexible.

                              Actually how do you give the user a font size option. I have seen it done, (no examples... sorry), but you know what I mean.

                              This may prove useful, Simon.
                              esafetysigns.co.uk
                              your instant download portal for self printable health and safety signs and posters
                              ... download once use as many times as you like !


                              http://www.esafetysigns.co.uk/index.html
                              http://www.esafetysigns.co.uk/acatalog/index.html

                              Comment

                              Working...
                              X