Page 1 of 1

CSS menu bar

Posted: Thu Oct 13, 2011 5:06 pm
by ebgames56
Im triyng to find a good CSS menu bar to use. I cant find 1. can some one be able to help me out

Re: CSS menu bar

Posted: Mon Nov 14, 2011 4:00 pm
by social_experiment
ebgames56 wrote:Im triyng to find a good CSS menu bar to use. I cant find 1. can some one be able to help me out
What should this menu do? Drop down, simple single links? Not too much information to go one :) Try using google, it might sound like a brush-off but articles about CSS Menus are plentiful

Re: CSS menu bar

Posted: Tue Feb 14, 2012 8:40 am
by social_experiment

Code: Select all

<html>
<title>
Creating Simple and Easy Css Menu Bar
</title>
<head>
</head>
<body>
</body >
</html>
This code will leave you scratching your head during the project as IE has the habit of ignoring certain style settings if you don't have a valid DOC Type in your header. Also, the title should be inside the head tag :)

Re: CSS menu bar

Posted: Mon Feb 20, 2012 6:26 am
by qeemat
Creating Simple CSS Menu Bar
Easy Way To Create A Simple And Easy Css Menubar

Easy Step 1:open note pad or dream weaver or any editorial you have

if you are using editorials then copy and past this code in to ur header part if not just open note pad and place this code

______________________________________________________________

Code For Note Pad

______________________________________________________________

< html>

<title>

Creating Simple And Easy Css Menu Bar

</title>

<head>

</head>

<body>

</body >

</html>

______________________________________________________________

END OF THE CODE

______________________________________________________________

Below Code Should Be Placed In Between Head Tags

—————————————————————————————–

Code Begins Place This Code In Head Part
—————————————————————————————–
<style type=”text/css”>

.hovermenu ul{
font: bold 13px arial;
padding-left: 0;
margin-left: 0;
height: 20px;
}

.hovermenu ul li{
list-style: none;
display: inline;
}

.hovermenu ul li a{
padding: 2px 0.5em;
text-decoration: none;
float: left;
color: black;
background-color: #e1e1e1; /* You Can Change this color */
border: 2px solid #e1e1e1; /*You can change this color*/
}

.hovermenu ul li a:hover{
background-color: #e5e5e5; /*You Can Change This Color*/
border-style: outset;
}

html>body .hovermenu ul li a:active{ /* Apply mousedown effect only to NON IE browsers */
border-style: inset;
}
</style>

—————————————————————————————–

END OF THE CODE

—————————————————————————————–

Easy Step 2: Copy And Paste This Code In Your Body Tag

______________________________________________________________

Code Begins

______________________________________________________________

<div class=”hovermenu”>
<ul>
<li><a href=”http://webdesigninfo.wordpress.com”>Home</a></li>
<li><a href=”http://webdesigninfo.wordpress.com/about/”>About Me</a></li>
<li><a href=”http://webdesigninfo.wordpress.com/web-templates/”>Web Templates</a></li>
<li><a href=”http://webdesigninfo.wordpress.com/contact-me/”>Contact Us</a></li>
<li><a href=”http://webdesigninfo.wordpress.com”>Downloads</a></li>
</ul>
</div>

______________________________________________________________

END OF THE CODE

______________