#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2012
    Posts
    1
    Rep Power
    0

    Need help with css menu pls newb here


    Ok hey guys.
    So what i try to acheive is to have a menu in the topnav of my site and when hovring the mouse over to show some stuff in a list under it..

    so far i`m working on local on a test html file until i get it working.
    so what i got so far is this menu:

    Code:
    <ul id="menu">
    	<li><a href="#">Notifications</a>
    		<ul>
    			<li id="foot-notify-954>
    				<a href="#" class="delete" onclick="deleteNotification('Delete this item?', 954);return false;">X</a><a href="http://test.com/testing">testing</a> left a comment for your <a href="http://test.com/member/174/blog/view/28/">blog</a> 22 hours ago
    			</li>
    			<li id="foot-notify-953>
    				<a href="#" class="delete" onclick="deleteNotification('Delete this item?', 953);return false;">X</a>
    				<p><a href="http://test.com/testing">testing</a> left a comment for your <a href="http://test.com/member/174/blog/view/28/">blog</a> <span>22 hours ago</span></p>
    			</li>
    		</ul>
    	</li>
    </ul>
    and my css code:

    Code:
    <style> ul { font-family: Arial, Verdana; font-size: 14px; margin: 0; padding: 0; list-style: none; } ul li { display: block; position: relative; float: left; } li ul { display: none; } ul li a { display: block; text-decoration: none; color: #ffffff; border-top: 1px solid #ffffff; padding: 5px 15px 5px 15px; background: #2C5463; margin-left: 1px; white-space: nowrap; } ul li a:hover { background: #617F8A; } li:hover ul { display: block; position: absolute; } li:hover li { float: none; font-size: 11px; } li:hover a { background: #617F8A; } li:hover li a:hover { background: #95A9B1; } </style>
    i think the problem is that i`m having more than 1 <a> hyperlink inside the notifications <li>
    id like each li notification to show in 1 line, as in the format, the X button at the start to remove it then the notification itself...
    pls help..i`m complety newb wich css
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2011
    Posts
    18
    Rep Power
    0
    Ok, I'm not entirely sure what your problem is, but I can see that in both Foot-Notify-954 and Foot-Notify-953 you forgot to put the closing quotation marks.

    Also, within both of those:

    Code:
    <li id="foot-notify-954>
    				<a href="#" class="delete" onclick="deleteNotification('Delete this item?', 954);return false;">X</a><a href="http://test.com/testing">testing</a> left a comment for your <a href="http://test.com/member/174/blog/view/28/">blog</a> 22 hours ago
    			</li>
    			<li id="foot-notify-953>
    				<a href="#" class="delete" onclick="deleteNotification('Delete this item?', 953);return false;">X</a>
    				<p><a href="http://test.com/testing">testing</a> left a comment for your <a href="http://test.com/member/174/blog/view/28/">blog</a> <span>22 hours ago</span></p>
    			</li>
    You put the same stuff, but for some reason within Foot-Notify-953, you put <p></p> around part of it and <span></span> around the "22 hours ago" and you didn't do that in Foot-Notify-954.

IMN logo majestic logo threadwatch logo seochat tools logo