|
HTML - Get Multiple Selection Values From Dropdown Menu
Hi,
This must be an easy question but a quick google did not turn up an answer for me. I have a dropdown menu and allows the user to select multiple items from the menu. After the user clicking the submit button, how do I get the user's (multiple) selections? I know I can use $POST['Name'} to get the value if there was only one selection. Thanks Similar TutorialsOkay, I am not new to HTML but am expanding my knowledge out from the basics and learning more. I have been scouring the internet for about a week trying to figure out this problem but to no avail. I need to know how to take a drop down box and have the selection open in a new window with height=600 width=600, status bar, no scroll bars and no toolbars. I already have the dropdown box setup, just need to know how to accomplish that latter. Thanks for the help, dt_gry! Hi, I am using css to create a dropdown menu. It works fine in all browsers except IE6. In IE6 a dropdown list covers the dropdown menu. please see the atachment/screenshot. Here is the html/css code I am using. HTML Code: {
position: relative; z-index: 1;}*/
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}
ul.dropdown {
position: relative;
z-index: 597;
float: left;
}
ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
z-index: 599;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
cursor: default;
}
ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
}
ul.dropdown ul li {
float: none;
z-index: 598;
}
ul.dropdown ul ul {
top: 1px;
left: 99%;
z-index: 598;
}
ul.dropdown li:hover > ul {
visibility: visible;
z-index: 598;
}
HTML Code: <div id="header" class="header" style="background-image: url(./images/blue-curve.jpg); background-position: top;">
<h1>
Finance and Risk
</h1>
<ul class="dropdown dropdown-horizontal noPrint">
<li><a href="#" class="dir">Data Management</a>
<ul>
<?php echo '<li><a href="main.php?PageName=import3' . SID . '">Upload Data</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=list' . SID . '">Download Data</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=delete' . SID . '">Delete Data</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=assetupdate' . SID . '">Update Data</a></li>'; ?>
</ul>
</li>
<li><a href="#" class="dir">Reports</a>
<ul>
<?php echo '<li><a href="main.php?PageName=reports' . SID . '">BS Overview</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=CDO' . SID . '">CDOs</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=impairment' . SID . '">Impairments</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=fvecapreport' . SID . '">FairValue and Risk</a></li>';?>
<?php echo '<li><a href="main.php?PageName=creditrisk' . SID . '">Credit Default Risk</a></li>';?>
<?php echo '<li><a href="main.php?PageName=securitydata' . SID . '">MarketData</a></li>';?>
</ul>
</li>
<li><a href="#" class="dir">Files & Manuals</a>
<ul>
<?php echo '<li><a href="magnitude.pdf" target="_blank">Product Codes</a></li>';?>
<?php echo '<li><a href="uploadmanual.pdf" target="_blank">Upload Manual</a></li>';?>
<?php echo '<li><a href="main.php?PageName=osmdocs' . SID . '">OSM Files</a></li>'; ?>
</ul>
</li>
<li><a href="#" class="dir">Miscellaneous</a> <ul>
<?php echo '<li><a href="main.php?PageName=creditcrises' . SID . '">Credit Crises</a></li>'; ?>
</ul>
</li>
<?php if ($_SESSION['Admin'] == "Yes") { ?>
<li><a href="#" class="dir">Admin </a>
<ul>
<?php echo '<li><a href="main.php?PageName=message' . SID . '">Flash Alerts</a></li>'; ?>
<?php echo '<li><a href="testmarcel1.php?' . SID . '">Test Marcel1</a></li>'; ?>
<?php echo '<li><a href="testmarcel2.php?' . SID . '">Test Marcel2</a></li>'; ?>
<?php echo '<li><a href="testmarcel3.php?' . SID . '">Test Marcel3</a></li>'; ?>
<?php echo '<li><a href="main.php?PageName=testajay1' . SID . '">Test Ajay1</a></li>'; ?>
<?php echo '<li><a href="testajay2.php?' . SID . '">Test Ajay2</a></li>'; ?>
<?php echo '<li><a href="testajay3.php?' . SID . '">Test Ajay3</a></li>'; ?>
</ul>
</li>
<?php } ?>
<li><a class="dir" href="main.php?PageName=menu">Menu</a>
<ul>
<?php echo '<li><a href="logout.php">Logout</a></li>'; ?>
<?php echo '<li><a href="#">Change password</a> </li>'; ?>
</ul>
</li>
<li><a class="dir" href="javascript:window.print()" color="green">Print</a> </li>
</ul>
</div>
Any one has an idea how to get the css menu on top of the dropdown list? Thanks in advance Hi.. I am having a html table with three columns and the rows are dynamic. I need to have a multiple selection of the rows and the value need to checked using javascript. I dont want any check box to be used... Can anyone help in getting this... Hey, I have a script at present which pre-loads 6 images and displays them on screen. I want a user to be able to select a checkbox next to the images so they can select which ones they want to use. On clicking continue the images selected are displayed on the next screen. Please can you help with coding for this as I am not getting very far. Thanks Hey guys. Man, it's been years since I've been here. Not that much into web design these days.. but as it turns out I was asked to make someone a site.. It went well and I managed to get good bits of code from online as you do, but I have stumbled across a problem.. I have an iFrame with a calendar in it (consisting of html and some javascript) and by clicking certain dates it will change the selection of a drop down menu (full of listed dates) which is located on the main page.. Because it is not simply changing a link and instead a selection on a menu, it required javascript and after a lot of messing around I got it to work.. this was the code: <a href="javascript:void(0)" onclick ="parent.document.getElementById('datechoose').value = '11';" style="display:block;">15</a> this, when attached to a link in the iFrame will select the 11th item on the menu on the main page. It only works online for some reason, but other than that. it works perfect.. Here's the problem. My dreamweaver template has screwed up as it often does.. and it will be waay to difficult to figure out the problem. so I'm scrapping that idea.. So now I have to update the menu options on about 15 different pages every week... OR - I could put this menu on it's own page in a seperate iframe so it only needs updated once.. So essentially, how would I modify this code to link from one iframe to another. I wish it was as simple as 'target' etc. but that won't work. I've looked at similar questions online, but none of the answers seem to work.. thanks in advance Hello, I'm new to this forum, so first, hello! Actually, I'm new to web design in general but have taken on the role at the church I work at because our old site was a mess. I downloaded some nice looking templates and have been using them as a foundation. The site is www.miamibc.com. If you go there and look at the header menu (home, about us, etc), I want to consolidate that menu some and add a drop down menu with more choices. Is there a way I can do this while keeping it looking the way it does now? If you need any more info from me, let me know. Thanks for your help! Ben Alright, I finally figured out what I need to do. Below are two templates that are inserted in my vBulletin template design. I have modded them somewhat, but now I am stuck. I am trying to get it to look like the following: http://www.wowhq.com/forum/calendar....=2007-4-18&c=1 -- located towards the bottom of the thread. If you could help me figure out how the heck to finish coding this, it would be much appreciated. NOTE: I have created the dropdown box in the second template. What needs to happen is that data needs to get pulled from the user's answers on the calendar_rsvp_form template and displayed in two separate columns on the calendar_rsvp template. Look at the link above to see exactly how the data is output. calendar_rsvp template: Code: <if condition="!$eventempty">
<hr>
</if>
<if condition="$rsvp_yes">
<b>$vbphrase[calendar_rsvpd] $vbphrase[yes]: $rsvp_yes_count </b>
<if condition="$eventinfo[rsvp_max_guests]">
(<phrase 1="$rsvp_yes_members" 2="$rsvp_yes_guests">$vbphrase[x_members_and_y_guests]</phrase>)
</if>
<table width="100%" border="0">
<tr>
<th width="20">Count</th>
<th width="100">Username</th>
<th width="100">Class</th>
<th width="100">Spec</th>
<th width="200">Date Registered</th>
<th>Comment</th>
</tr>
<tr>
<th width="20"></th>
<th width="100"></th>
<th width="100"></th>
<th width="100"></th>
<th width="200"></th>
<th></th>
</tr>
</table>
</if>
<if condition="$rsvp_maybe">
<b>$vbphrase[calendar_rsvpd] $vbphrase[maybe]: $rsvp_maybe_count</b>
<if condition="$eventinfo[rsvp_max_guests]">
(<phrase 1="$rsvp_maybe_members" 2="$rsvp_maybe_guests">$vbphrase[x_members_and_y_guests]</phrase>)
</if>
<ul><if condition="$vboptions[rah_rsvp_showavatar]"><table>$rsvp_maybe</table><else />$rsvp_maybe</if></ul>
</if>
<if condition="$rsvp_no">
<b>$vbphrase[calendar_rsvpd] $vbphrase[no]: $rsvp_no_count</b>
<ul><if condition="$vboptions[rah_rsvp_showavatar]"><table>$rsvp_no</table><else />$rsvp_no</if></ul>
</if>
calendar_rsvp_form template: Code: <form action="calendar.php?do=getinfo&e=$eventinfo[eventid]&day=$rsvp_day" method="post">
<input type="hidden" name="do" value="getinfo" />
<input type="hidden" name="cdo" value="rsvp" />
<input type="hidden" name="day" value="$rsvp_day" />
<input type="hidden" name="e" value="$eventinfo[eventid]" />
<input type="hidden" name="s" value="" />
<if condition="$bbuserinfo['userid'] AND $expires[0]>=0">
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr><td class="alt2">
<if condition="$expires[unixdate]">
<if condition="$myrsvp">
<b><phrase 1="$rsvp_day_formatted" 2="$myrsvp">$vbphrase[calendar_rsvp_yoursvp]</phrase></b><br />
<font class="smallfont"><i><phrase 1="$expires[date]">$vbphrase[calendar_rsvp_maychangeby]</phrase></i></font>
<else />
<b><phrase 1="$rsvp_day_formatted">$vbphrase[calendar_rsvp_attendquestion]</phrase></b><br />
<font class="smallfont"><i><phrase 1="$expires[date]">$vbphrase[calendar_rsvp_changeby]</phrase></i></font>
</if>
<br/>
<else />
<if condition="$myrsvp">
<b><phrase 1="$rsvp_day_formatted" 2="$myrsvp">$vbphrase[calendar_rsvp_yoursvp]</phrase></b><br />
<font class="smallfont"><i>$vbphrase[calendar_rsvp_maychange]</i></font>
<else />
<b><phrase 1="$rsvp_day_formatted">$vbphrase[calendar_rsvp_attendquestion]</phrase></b><br />
<font class="smallfont"><i>$vbphrase[calendar_rsvp_changelater]</i></font>
</if>
<br/>
</if>
<br/>
<INPUT TYPE=RADIO NAME="response" VALUE="Yes" <if condition="$myrsvp=='Yes'">checked="checked"</if>>$vbphrase[yes]
<INPUT TYPE=RADIO NAME="response" VALUE="Maybe" <if condition="$myrsvp=='Maybe'">checked="checked"</if>>$vbphrase[maybe]
<INPUT TYPE=RADIO NAME="response" VALUE="No" <if condition="$myrsvp=='No'">checked="checked"</if>>$vbphrase[no]<br \>
<if condition="$eventinfo['rsvp_max_guests']">
<i>$vbphrase[calendar_rsvp_guests_prompt] <input type="text" name="guests" id="guests" size="3" value="$myguests">
$vbphrase[calendar_rsvp_guests]. (<phrase 1="$eventinfo[rsvp_max_guests]">$vbphrase[calendar_rsvp_guest_limit]</phrase>)</i>
</if>
<br/>
 <b>Class/Spec:</b>
<select name="class">
<option value="Druid (Feral Combat)">Druid (Feral Combat)</option>
<option value="Druid (Restoration)">Druid (Restoration) </option>
<option value="Druid (Balance)">Druid (Balance)</option>
<option value="Hunter (Beast Mastery)">Hunter (Beast Mastery)</option>
<option value="Hunter (Marksmanship)">Hunter (Marksmanship)</option>
<option value="Hunter (Survival)">Hunter (Survival)</option>
<option value="Mage (Arcane)">Mage (Arcane)</option>
<option value="Mage (Fire)">Mage (Fire)</option>
<option value="Mage (Frost)">Mage (Frost) </option>
<option value="Paladin (Holy)">Paladin (Holy)</option>
<option value="Paladin (Protection)">Paladin (Protection)</option>
<option value="Paladin (Retribution)">Paladin (Retribution)</option>
<option value="Priest (Discipline)">Priest (Discipline)</option>
<option value="Priest (Holy)">Priest (Holy)</option>
<option value="Priest (Shadow)">Priest (Shadow)</option>
<option value="Rogue (Assassination)">Rogue (Assassination)</option>
<option value="Rogue (Combat)">Rogue (Combat)</option>
<option value="Rogue (Subtlety)">Rogue (Subtlety)</option>
<option value="Shaman (Elemental)">Shaman (Elemental)</option>
<option value="Shaman (Enhancement)">Shaman (Enhancement)</option>
<option value="Shaman (Restoration)">Shaman (Restoration)</option>
<option value="Warlock (Affliction)">Warlock (Affliction)</option>
<option value="Warlock (Demonology)">Warlock (Demonology)</option>
<option value="Warlock (Destruction)">Warlock (Destruction)</option>
<option value="Warrior (Arms)">Warrior (Arms)</option>
<option value="Warrior (Fury)">Warrior (Fury)</option>
<option value="Warrior (Protection)">Warrior (Protection)</option>
</select>
<br/>
<br/>
<if condition="$maxlength">
<table>
<tr>
<td><b>$vbphrase[comment]:</b><br \>
<td align="right"><font class="smallfont"><i>($vbphrase[calendar_rsvp_maxlength] = $maxlength)</i></font></td>
</tr>
<tr>
<td colspan="2">
<textarea name="comment" rows="2" cols="80">$mycomment</textarea>
</td>
</tr>
</table>
</if>
<input type="submit" class="button" value="$vbphrase[submit]" />
</td></tr>
</table>
</form>
</if>
<if condition="$expires[0]<0">
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr><td class="alt2" align="center" valign="center" height="75"><font size="2"><b>$vbphrase[calendar_rsvp_closed]</b></font></td></tr>
</table>
</if>
Any assistance that can be provided is greatly appreciated. I am unable to get my dropdown menu to drop in front of my left column. I have copied the css and the html below. I am not sure if there is something wrong with the HTML or the css so please let me know if I need to post this to a CSS thread. Thank you for any help provided. #navigation { margin: 0; padding: 0; width: 100%; background-color: #f5f5f5; height: 1.3em; float: left; clear: both; } #navigation li { list-style: none; float: left; } #navigation li a { display: block; padding: 0 6px; background-color: #f5f5f5; color: #0000ff; text-decoration: none; border-right: 2px solid #fff; font-size: 12px;} #navigation li ul { display: none; width: 10em; background-color: #0000ff; } #navigation li:hover ul, #navigation li.hover ul { display: block; position: absolute; margin:0; padding:0; } #navigation li:hover li, #navigation li.hover li { float: none; } #navigation li:hover li a, #navigation li.hover li a{ background-color: #0000ff; border-bottom: 1px solid #fff; color: #ffffff; } #navigation li li a:hover{ background-color: #0000ff;} /* column container */ .colmask { position:relative; clear:both; float:left; width: 100%; } /* common column settings */ .colright, .colmid, .colleft { float:left; width:100%; position:relative; } .col1, .col2, .col3 { float:left; position:relative; padding:0 0 1em 0; } /* 3 Column settings */ .threecol { background-image: url('DCIMAGE3.jpg'); } .threecol .colmid { right:25%; background-image: url('DCIMAGE3.jpg'); } .threecol .colleft { right:50%; background-color: #ffffff; } .threecol .col1 { width:46%; text-align: center; } .threecol .col2 { width:21%; left:31%; } .threecol .col3 { width:21%; left:85%; } ul id="navigation"> <li><a href="www.zphibeasternregion.org">Home</a></li> <li><a href="#">National Links</a><ul> <li><a href="www.zphib1920.org">Zeta Phi Beta Sorority, Inc.</a></li> <li><a href="http://www.zphib1920.org/antihazing.html"> Sorority's Statement on Hazing</a></li></ul> </li> <li><a href="#">States</a><ul> <li><a href="DistrictofColumbia.htm">District of Columbia</a></li> <li><a href="NorthCarolina.htm">North Carolina</a></li> <li><a href="Virginia.htm">Virginia</a></li> <li><a href="WestVirginia.htm">West Virginia</a></li></ul></li> <li><a href="#">Contact us</a><ul> <li><a href="regionalleadership.htm">Regional Leadership</a></li></ul> </li> </ul> *****html <div class="colmask threecol"> <div class="colmid"> <div class="colleft"> <div class="col1"> <!-- Column 1 start --> <p>fajdflajslrejlaje;jerjekkj</p> <!-- Column 1 end --> </div> <div class="col2"> <!-- Column 2 start --> <p>fajdflajslrejlaje;jerjekkj</p> <!-- Column 2 end --> </div> <div class="col3"> <!-- Column 3 start --> <p>fajdflajslrejlaje;jerjekkj</p> <!-- Column 3 end --> </div> </div> </div> So for a while a have been trying very hard to create a dropdown menu for my navigation bar. I have searched the web long and hard for this and found little valuable information. I have a four link graphical navigation bar made from image sprites (see this tutorial) and have been trying to make a dropdown bar for just the second link. I know a bit of html/css but very little javascript which if I understand what I read from google, thats what I will need. Can anyone help please? I'm aware that the menu in my site can get too-big to display properly at low to medium resolutions and/or browser windows that aren't maximized, so after considering a couple of possible solutions i figured i'd fix it by putting everything into five general categories, two of which would have subcategories (and some of the subcategories would have subsubcategories, and that's as far as it goes). So... ...I'm looking for a code to turn my menu into a dropdown one. Now, as far as i'm concerned there are three types of dropdown menus, two of which i don't like and thus don't want. Google only returns results for one type, which, true to Murphy's law, is one of the two i don't want. Example of the one i want: the one on the top menu on this site ("HOME", "TUTORIAL", "FORUM", "QUICK LIST") (with possibility of images and that kind of stuff) Example of the one i don't want that Google returns: the kind on this site (default computer type) Example of the one i don't want that Google doesn't return: the kind that appears when you click on "Search", "KotV Roster" or any of those links on this site (forum type) I tried to copy the relevant code on the first page i linked to, but either i didn't copy all that's relevant or i'm doing something wrong with it. I considered both possibilities and tried to fix things, but all failed. So how do i do it? Here's a rough picture of exactly what i want: click. I hope the notes and pictures are enough, but if something is unclear please ask away. Sorry for the weird font, but i didn't pay much attention to how the whole thing looked; it's just a quick sketch i made in two minutes. Thanks in advance. Hi, I have a menu that lets me select from multiple options, and I want that any option that I choose will lead me to another website, after that I click the submit button. How I do this? Code: <form action="" method="post"> <select name="Dropdown Menu" id="menu"> <option selected>Select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <input type="submit" value="" id="button"> </form> Thanks, Steve I recently changed my navigation links from js to html and css based links but have a few problems with the layout, I wonder if you anyone can help? http://www.for-rent-nerja.co.uk/ If you rollover the 'For Rent' dropdown do you notice how the dropdown is appearing under my sidebar! Is there any way to repair that? It is running from http://www.for-rent-nerja.co.uk/nav_menu/style.css I am also having problems stretching the width of the links to fit my 950px width, they seem to break apart after about 140px individually! I've been working on a dropdown menu using html tables, css and javascript, but it seems to fail in Firefox. When I hover the button the first time it's like it should be, however, when I hover it the second time the dropdown menu actually comes next to the button instead of below it. It's hard to explain, so I've uploaded it to http://darkool.nl/table.php This picture also explains what happens in Firefox: It works fine in other browsers (IE, Opera and Safari) Code: <script>
function showMenu(num) {
for (var count = 1; id = document.getElementById("show"+num+"."+count); ++count) {
id.style.display = "block";
}
}
function hideMenu(num) {
for (var count = 1; id = document.getElementById("show"+num+"."+count); ++count) {
id.style.display = "none";
}
}
</script>
<style>
* {
margin: none;
padding: none;
}
tr {
vertical-align: top;
}
td.menu0 {
border: 1px solid black;
display: none;
}
td.menu1 {
border: 1px solid black;
display: block;
}
</style>
<table onMouseOver='showMenu(0)' onMouseOut='hideMenu(0)' id='menu0' class='menu' cellpadding='0' cellspacing='0'>
<tr><td id='show' class='menu1'>Over ons</td></tr>
<tr><td id='show0.1' class='menu0'>Informatie</td></tr>
<tr><td id='show0.2' class='menu0'>Biografie</td></tr>
</table>
hey I'm new at the forum here and kinda need some help with a multi level drop down menu for my website. there shall be 2 boxes where in the first one you can choose your Zipcode and then a box below to choose the city you are living in. first time working with html and I'm not sure if it can be made be that, and i was thinking i could get some help with that for some one in here. let me know if it's not understandable^^ ^^thanks for the help^^ Hello I have a problem that i dont know how to fix with drop down menu's i seem to be missing out something i applied a tutorial and eventually came up with this http://www.piglatinhiphop.com/drop/index.htm what i basically want is when i hover on the button "Services" to show the menu which works fine but there are 3 rows of buttons and the button Services is on one of them sitting there alone i tried to fix it by just clicking backspace in frong page and came up with this result http://www.piglatinhiphop.com/drop/gs.htm but u see when i hover services it dont drop down nothing and if u notice there ill still be a second row that will have a black area to the far left, thats the area that will show the drop down menu also if u hover sumwhere below the button "Downloads" the list drops now see i want the site to look as it is on the main official page www.piglatinhiphop.com but also have the list to drop when u hover "Services" The files are attached with what i came up with when i 1st applied the tutorial (the 1st result that had 3 rows) Please help me out, i am doing a favor to a friend and i dont want to fail him Thanks I had a program automatically generate code for me for a dropdown menu, but whenever I place the code into iWeb the HTML snippet just makes a blank box. Can anyone give me a hand? Here's the code: Code: <script src="psnavjs.js" type="text/javascript"></script><noscript><OBJECT id="psnavobj" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" WIDTH=950 HEIGHT=53> <PARAM NAME=movie VALUE="psnav.swf"> <PARAM NAME=menu VALUE=false> <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#000000> <EMBED src="psnav.swf" menu=false quality=high bgcolor=#000000 WIDTH=950 HEIGHT=53 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></EMBED></OBJECT></noscript> im having trouble with a drop-down menu. when i highlight the <li>'s that drop down, i can't do anything that will make them dissapear. here's my java: Code: <script type="text/javascript"><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
heres my html: Code: <li><a href="#">About us</a> <ul> <li><a href="#">Our company</a></li> <li><a href="#">Services we offer</a></li> <li><a href="#">Meet our people</a></li> </ul> </li> heres my css: Code: /* drop down navigation */
#nav, #nav ul {
float: left;
width: 100%;
list-style: none;
line-height: 0.6em;
background: #333;
font-weight: normal;
padding: 0;
border: solid thin #000;
margin: 15px 0 30px 0;
color:#fff;
}
#nav a {
display: block;
width: 124px;
color: #fff;
text-decoration: none;
font-size:0.7em;
padding:7px;
border-left: solid 4px #000;
}
#nav li {
float: left;
padding: 0;
width: 20%;
}
#nav li ul {
position: absolute;
left: -999em;
height: auto;
width: 10%;
width: 13.9em;
font-weight: normal;
border-width: 1px;
margin: 0;
padding:0;
}
#nav li li {
margin-left:-1px;
width: 13em;
}
#nav li ul a {
width: 205px;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
#nav a:hover{
background: #444;
}
/* end of drop down navigation*/
any ideas??? Reference: http://www.skinquotient.com This is a shopping cart using OSCommerce. In the left hand column, you will notice that the second item from the top is a drop down menu titled "Shop by Concern". The length of some of the value in the shop by concern drop down menu are wider than the width of the left column. In firefox, when you open the menu, the menu itself expands wider then the width of the column so life is good. Of course, IE likes to make your life difficult, so in IE the menu values are truncated to fit the column width. I don't want to make that left column wider - I want to leave as much room as possible in the main body for content. My preferred solution would be to somehow make that menu expand in IE like it does in firefox, however I don't know if this is possible. Ideas are welcome! Hi all I have made a dropdown menu where the user is to select one of the options but I just cannot for the life of me workout which cose I need to use for that option to show up on the following page where all the writen details (which all work )exept for the chosen dropdown menu choice. I hope I have made sence here. Can anyone please help me. I can copy and paste what I have if that will help.Just let me know please, Is there anything wrong with this li tag? <li><a href="uc.html" class="underline">Item 1</a></li> uc.html is located in the same directory. The menu is disabled and doesn't work. I can't find out what the problem is. |
|||||||