www.webdeveloper.com
Results 1 to 6 of 6

Thread: hover not showing and different font sizes in different links.

Hybrid View

  1. #1
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125

    hover not showing and different font sizes in different links.

    I am trying to create a sitemap page with links to the rest of the pages in my site. I have 3 problems that I can't resolve;

    1. Hover doesn't show when I scroll over links.

    Here is the css code.
    Code:
    #menu-1 a  { color: black;}
    #menu-1 a:hover { color:yellow;}
    #menu-1 a:active { color:#FF0000; }
    I am also having problems with the font size in each link. As you go down the page the fonts increase in size. I use 1.25em for the main link and 1.00 for the sub link.

    You can see the problem here

    This is the code for the links;
    Code:
    #menu-1 {list-style: none;
             text-align: center; 
             font-size: 1.50em;
             font-color: black;
    }
    #menu-1 a  { color: black;}
    #menu-1 a:hover { color:yellow;}
    #menu-1 a:active { color:#FF0000; }
    #sub-menu-1 {list-style: none;
                 text-align: centre;       // changed to center,  comment is only here, not in file//
                 font-size: 1.00em;
    } 
    #menu-2 {list-style: none;
             text-align: center; 
             font-size: 1.25em;
             font-color: black;
    }
    #sub-menu-2 {list-style: none;
                 text-align: center;
                 font-size: 1.00em;
    } 
    #menu-3 {list-style: none;
             text-align: center; 
             font-size: 1.25em;
    }
    If you want to see all the css code for the page it is here

    How do i resolve these problems?

  2. #2
    Join Date
    Oct 2012
    Location
    Gujarat, India.
    Posts
    35
    I am not pro but i think i've got answer....

    For your first quest:
    I checked source code & nothing like menu-1 exists in your source code on website you've posted.

    For your second quest:
    I guess that menu-3 is sub menu of menu-2 and you are not closing <div> tags! Like, menu-3 doesn't ends, so all tags below it comes under it....

  3. #3
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125
    Thanks for your reply. I followed your suggestion by changing all the menu divs to end with </ul> and </div> it worked a treat. I was left with bullet points but I copied the code in my main nav bar for getting rid of them.

  4. #4
    Join Date
    Oct 2012
    Location
    Gujarat, India.
    Posts
    35
    Ok, i think you know but for getting rid of bullets, type this in css, here class name represents your class in HTML.

    .className {
    text-decoration:none;
    }

  5. #5
    Join Date
    Sep 2006
    Location
    new york
    Posts
    267
    NO deepode!
    For <ul> unordered/bullets or <ol> ordered/numbered LISTS it is list-style: none.
    Values for text-decoration: none underline overline line-through blink [deprecated] inherit -- would be used on text or links.
    Last edited by auntnini; 10-13-2012 at 05:51 PM. Reason: refine

  6. #6
    Join Date
    Oct 2012
    Location
    Gujarat, India.
    Posts
    35
    oh, thanks. :P actually i was writing "text-decoration:none;" many time for <a> tags.. he he.

    Now to the main point....
    @tonyWebb,

    You can tell him to enter date while uploading in one sure method like, dd/mm/yyyy or mm/dd/yyyy then through javascript you can broke date in two parts. Instead of dd/mm/yyyy you can tell user to type date in text input filed as dd/mm.yyyy, so in javascript you can take input as array so you can easily broke(using indexOf (imn't sure about spelling )) that input into dd, mm & yyyy. Instead using arrays you can also use string methods. Then using for loops....to check all dates and after it you can post it. .

    Hope it helps and i may also try to give you code.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles