« html & CSS Help »

Wild-EYE · Feb 9, 2015

html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" href="menu_style.css" type="text/css" />
</head>
<body>
<br>
<br>
<div class="menu">
<ul>
<li><a href="#" >Home</a></li>
<li><a href="#" id="current">Products</a>
<ul>
<li><a href="#">Drop Down CSS Menus</a></li>
<li><a href="#">Horizontal CSS Menus</a></li>
<li><a href="#">Vertical CSS Menus</a></li>
<li><a href="#">Dreamweaver Menus</a></li>
</ul>
</li>
<li><a href="/faq.php">FAQ</a>
<ul>
<li><a href="#">Drop Down CSS Menus</a></li>
<li><a href="#">Horizontal CSS Menus</a></li>
<li><a href="#">Vertical CSS Menus</a></li>
<li><a href="#">Dreamweaver Menus</a></li>
</ul>
</li>
<li><a href="/contact/contact.php">Contact</a></li>
</ul>
</div>

</body>
</html>

CSS

.menu{
border:none;
border:0px;
margin:0px;
padding:0px;
font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
}
.menu ul{
background:#333333;
height:35px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
float:left;
padding:0px;
}
.menu li a{
background:#333333 url("images/seperator.gif") bottom right no-repeat;
color:#cccccc;
display:block;
font-weight:normal;
line-height:35px;
margin:0px;
padding:0px 25px;
text-align:center;
text-decoration:none;
}
.menu li a:hover, .menu ul li:hover a{
background: #2580a2 url("images/hover.gif") bottom center no-repeat;
color:#FFFFFF;
text-decoration:none;
}
.menu li ul{
background:#333333;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:225px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul{
display:block;

}
.menu li li {
background:url('images/sub_sep.gif') bottom left no-repeat;
display:block;
float:none;
margin:0px;
padding:0px;
width:225px;
}
.menu li:hover li a{
background:none;

}
.menu li ul a{
display:block;
height:35px;
font-size:12px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a{
background:#2580a2 url('images/hover_sub.gif') center left no-repeat;
border:0px;
color:#ffffff;
text-decoration:none;
}
.menu p{
clear:left;
}

මචංලා මේක තියෙන්නේ drop down ලිස්ට් එකක් විදියට මේක drop up කරන්න බැරිද

DooA · Feb 9, 2015

mokadda aula

ganidu94 · Feb 9, 2015

Mokadda bung drop up kiyanne ? therenna kiyapan ko

sahanyugantha · Feb 9, 2015

http://jsfiddle.net/W5FWW/4/
meka balapan mchn

shenic · Feb 9, 2015

මෙන්න විසඳුම. මම try කරලා බැලුවා. වැඩ කරනවා.

http://stackoverflow.com/questions/7814186/drop-down-menu-that-opens-up-upward-with-pure-css

ඕක හරියනවද?

Lakshan-Seram · Feb 9, 2015

PHP:

.menu li {
  float: left;
  padding: 0;
  position: relative;
}

PHP:

.menu li ul {
  background: none repeat scroll 0 0 #333333;
  border: 0 none;
  bottom: 35px;
  display: none;
  height: auto;
  margin: 0;
  padding: 0;
  position: absolute;
  width: 225px;
  z-index: 200;
}

Thawa deyak kiyannada? Float left tiyenakota display: inline; danawanam wadath hodai.. IE6 margin double wena scene ekak tiyenawa float waladi.

---
6+ years exp. in front-end dev.

Wild-EYE · Feb 9, 2015

sahanyugantha said:
bump

DooA said:
mokadda aula

ganidu94 said:
Mokadda bung drop up kiyanne ? therenna kiyapan ko

sahanyugantha said:
http://jsfiddle.net/W5FWW/4/
meka balapan mchn

shenic said:
මෙන්න විසඳුම. මම try කරලා බැලුවා. වැඩ කරනවා.

http://stackoverflow.com/questions/7814186/drop-down-menu-that-opens-up-upward-with-pure-css

ඕක හරියනවද?

mac14 said:
bump

Thanks Machanla Wade Goda

Wild-EYE · Feb 9, 2015

Lakshan-Seram said:
PHP:

.menu li { float: left; padding: 0; position: relative; }

PHP:

.menu li ul { background: none repeat scroll 0 0 #333333; border: 0 none; bottom: 35px; display: none; height: auto; margin: 0; padding: 0; position: absolute; width: 225px; z-index: 200; }

Thawa deyak kiyannada? Float left tiyenakota display: inline; danawanam wadath hodai.. IE6 margin double wena scene ekak tiyenawa float waladi.

---
6+ years exp. in front-end dev.

ගොඩක් thanks මචං help එකට වැඩේ එළකිරි වගේ හරි ගියා 

rehanandrian · Feb 9, 2015

https://play.google.com/store/apps/details?id=com.rehanandrian.slpaththara

srilankan News Paper App

Lakshan-Seram · Feb 9, 2015

Wild-EYE said:
ගොඩක් thanks මචං help එකට වැඩේ එළකිරි වගේ හරි ගියා 

ela ela.. front end dev idenaganin hodata.. IE7,8 target karapan.. outdated kiyala nikan inne nethuwa owage errors fix karanna mawa wenama hire karanawa clients la.. front-end rate eka $25 wage yanawa patta meter nam ita wada..

penawa ne IE wala wedagat kama.. dawas dekai $319..

happy to help / teach you something

good luck!

Wild-EYE · Feb 9, 2015

Lakshan-Seram said:
ela ela.. front end dev idenaganin hodata.. IE7,8 target karapan.. outdated kiyala nikan inne nethuwa owage errors fix karanna mawa wenama hire karanawa clients la.. front-end rate eka wage yanawa patta meter nam ita wada..

penawa ne IE wala wedagat kama.. dawas dekai

happy to help / teach you something good luck!

Thanks Bro, I will Keep it Mind, Thank You Again... 

Search

Latest ads

« html & CSS Help »

Wild-EYE

Well-known member

DooA

Well-known member

ganidu94

Well-known member

sahanyugantha

Well-known member

shenic

Member

Lakshan-Seram

Well-known member

Attachments

Wild-EYE

Well-known member

Wild-EYE

Well-known member

rehanandrian

Member

Lakshan-Seram

Well-known member

Attachments

Wild-EYE

Well-known member

Similar threads