Question

New to css. I have a div element, in which there are multiple links in it, now I like to apply css to all of the elements inside the div like below:

#menu {
    top: 150px;
    left: 650px;
    position: absolute;
    color: #151B54;
    font: 10pt;
    font-family: Arial;
}

However this doesn’t seem to be working.

Here is the div:

    <div id="menu">
        <asp:HyperLink ID="lnk_Home" runat="server"  
        NavigateUrl="~/Default.aspx">  Home  </asp:HyperLink>
    </span>
    &nbsp;&nbsp;<asp:HyperLink ID="HyperLink14" runat="server" NavigateUrl="~/About/About.aspx" 
    Target="_blank">  About  </asp:HyperLink>
&nbsp;
<asp:HyperLink ID="HyperLink16" runat="server" 
    NavigateUrl="~/About/ContactUs.aspx" Target="_blank">  Contact Us  </asp:HyperLink>
<asp:HyperLink ID="HyperLink17" runat="server" 
    NavigateUrl="~/About/FAQ.aspx" Target="_blank">  FAQ  </asp:HyperLink>
    </div>

Answer 1

None of your CSS styles anything inside of the #menu div.The right way would be like this:

div#menu {
    position: absolute;
    top: 150px;
    left: 650px;
}

/* "<asp>" isn't a valid HTML element, but I assume that
 * <asp:Hyperlink> actually generates an HTML anchor */

/* Links also have pseudo-elements that represent their
 * valid statuses.*/
div#menu a,
div#menu a:visited,
div#menu a:hover,
div#menu a:active,
div#menu a:focus {
    color: #151B54;
    font: 10pt;
    font-family: Arial;
}

More information about the pseudo-classes mentioned can be found here: http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes