HTML - Control Vertical Cell Sizing
I am using the following code that creates the desired effect in Firefox 2 but not in IE 7.
By increasing the height of the image in the "rowspan=2" cell at the bottom-right, I would like only the bottom-left and bottom-center cells to expand vertically. However, this only happens in FF and not IE. In IE the middle-left and middle-center cells also expand. Any ideas how to make this work, and control which cells expand? Code: <table width="200" border="0" cellpadding="0" cellspacing="0" bgcolor="#FF00FF"> <tr> <td><img src="student01.jpg" width="100" height="100" /></td> <td bgcolor="#9900FF"><img src="student01.jpg" alt="" width="100" height="100" /></td> <td bgcolor="#CC0000"><img src="student01.jpg" alt="" width="100" height="100" /></td> </tr> <tr> <td><img src="student01.jpg" alt="" width="100" height="100" /></td> <td bgcolor="#CC0000"><img src="student01.jpg" alt="" width="100" height="100" /></td> <td rowspan="2" bgcolor="#CCFF33"><img src="student01.jpg" alt="" width="100" height="300" /></td> </tr> <tr> <td bgcolor="#00FF00"><img src="student01.jpg" alt="" width="100" height="100" /></td> <td bgcolor="#FF3300"><img src="student01.jpg" alt="" width="100" height="100" /></td> </tr> </table> Similar TutorialsHi I am creating a website template for a content management system, so i need to ensure that the content area can vertically stretch to any height, But i am currently having some trouble with the tables. I was wondering if anyone has a solution that would allow the content area to stretch without showing the grey background behind the surrounding images, as shown in the screenshot. The bottom row can be extended without issue, but by default when content is added to the content area its the middle row that is extending. How can i stop this? Also i need to centre both the tables, but one is an absolute div. Is there someway i can centre these but ensure that both tables are always aligned on top of each other? Thanks in advance for your help. HTML Code: <html> <head> <meta http-equiv="Content-Language" content="en-au"> <title>NewcastleRoofingWebsite1024x768</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body bgcolor="#C0C0C0" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (NewcastleRoofingWebsite1024x768.psd) --> <div > <table id="Table_01" width="1015" height="761" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="12"> <img src="images/index_01.jpg" width="1015" height="229" alt=""></td> </tr> <tr> <td colspan="2" rowspan="2"> <img src="images/index_02.jpg" width="282" height="47" alt=""></td> <td> <img src="images/index_03.jpg" width="116" height="36" alt=""></td> <td rowspan="2"> <img src="images/index_04.jpg" width="2" height="47" alt=""></td> <td> <img src="images/index_05.jpg" width="117" height="36" alt=""></td> <td rowspan="2"> <img src="images/index_06.jpg" width="2" height="47" alt=""></td> <td> <img src="images/index_07.jpg" width="117" height="36" alt=""></td> <td rowspan="2"> <img src="images/index_08.jpg" width="2" height="47" alt=""></td> <td> <img src="images/index_09.jpg" width="117" height="36" alt=""></td> <td rowspan="2"> <img src="images/index_10.jpg" width="2" height="47" alt=""></td> <td> <img src="images/index_11.jpg" width="119" height="36" alt=""></td> <td rowspan="2"> <img src="images/index_12.jpg" width="139" height="47" alt=""></td> </tr> <tr> <td> <img src="images/index_13.jpg" width="116" height="11" alt=""></td> <td> <img src="images/index_14.jpg" width="117" height="11" alt=""></td> <td> <img src="images/index_15.jpg" width="117" height="11" alt=""></td> <td> <img src="images/index_16.jpg" width="117" height="11" alt=""></td> <td> <img src="images/index_17.jpg" width="119" height="11" alt=""></td> </tr> <tr> <td> <img src="images/index_18.jpg" width="10" height="9" alt=""></td> <td colspan="11" rowspan="2"> <img src="images/index_19.jpg" width="1005" height="484" alt=""></td> </tr> <tr> <td> <img src="images/index_20.jpg" width="10" height="475" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="10" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="272" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="116" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="2" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="117" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="2" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="117" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="2" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="117" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="2" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="119" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="139" height="1" alt=""></td> </tr> </table> <p> </p> <div style="position: absolute; width: 1020px; height: 100%; z-index: 1; top: 288px; left:0" id="layer2"> <table id="Table_01" width="1015" height="477" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="50" colspan="2"> </td> <td colspan="5"> <img src="images/index_05.png" width="806" height="50" alt=""></td> <td> </td> </tr> <tr> <td height="257" colspan="2"> </td> <td colspan="2" background="images/index_08.png" height="257"> </td> <td rowspan="2" bgcolor="#FFFFFF"> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> <p> <p> </td> <td colspan="2" background="index_10.png" height="257"> </td> <td height="257"> </td> </tr> <tr> <td colspan="3" background="index_12.png"> <p>h</td> <td background="images/index_13.png"> </td> <td background="images/index_14.png"> </td> <td colspan="2" background="index_15.png"> </td> </tr> <tr> <td height="41" colspan="2"> <img src="images/index_16.png" width="96" height="41" alt=""></td> <td colspan="5"> <img src="images/index_17.png" width="806" height="41" alt=""></td> <td> <img src="images/index_18.png" width="113" height="41" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="10" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="86" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="33" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="716" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="113" height="1" alt=""></td> </tr> </table></div></div> <!-- End ImageReady Slices --> </body> </html> Hello! I am new here, I know CSS and HTML basics and would like to ask you how to put a vertical slider inside a table cell. Thank you! Hi everyone: Any help appreciated. Objective: To have three equally sized and spaced images arranged horizontally, with their size set automatically by the size of the window. Development: I'm using a Mac, and I don't have ready access to a PC to experiment. What I tried: Code: <table> <tr> <td><img src = "a.png" style = "width: 100%" /></td> <td><img src = "b.png" style = "width: 100%" /></td> <td><img src = "c.png" style = "width: 100%" /></td> </tr> </table> <p class = "caption">A caption for the 3 images</p> <p class = "legend" >A legend for the three images</p> What happened: This works perfectly in Safari and Firefox (Mac) and Firefox under Vista, but in Internet Explorer under Vista , the images are HUGE - the unscaled size of the originals. What I think is the reason: IE is taking 100% to be relative to the width of the body element, not the td element. What I don't want to have to do: Use fixed sizes or calculate the sizes on the fly. What I'm trying now: removing the table and using a div, and inside that, setting the image width to 33% and floating one right and one left. What's the trick to get around this IE "gotcha" please? Thanks from a newbie. hi, i have a jsp page, in this page i am displaying data retrieved from mysql database. Now the problem is i must color table cell based on cell value. how to implement this.please give me an sample or working code foe this problem.( any code is accepted) preferably html or javascript. i.e if cell value is "late" then display that cell in red color else display the cell in green color please help me. Thanks ad Regards Akash How can I make my forms smaller. I already know how to control length, but how can I make the height lower. Ok I was just informed that on our companies site that there is a new window that pops up when a link is clicked. This is supposed to happen but the one thing I am trying to figure out is that the new window is rather small and the customer has to always enlarge it. They are using IE. I have tested it with IE7 with the same results as reported but it has also been tested with FF and SeaMonkey and the new window is large. Is this an IE thing, perhaps a setting or do I actually have to add something to my CSS/HTML to account for this? Thank you for the help. Im having problems getting my table to the right size. I want it to be 100% of the page but it only becomes 100% of whats inside the table. Any ideas what to do to solve this? Thanks Jake At the mo, the code is Code: <table summary="News" width="100%"> Hi, I have been having issues with a scroll bar on my page, and have tried a few different html codes, and have messed with sizing but am not getting the result I want. Here is the page I am referring to: http://userwww.sfsu.edu/~davidson/ar...tractbody.html I would like for there to be only the horizontal bar, like I have. But I would like the box to be smaller (i've tried making the grid's width smaller, but then the scrollbar doesn't have the pictures side-by-side, but pushes one to the bottom and it creates a vertical scroll bar). I would like it to be so that one picture or one and a half pictures, it doesn't matter, is shown. i want less to be automatically visible. i want it so you just scroll to view the rest, all side by side. Hopefully that makes sense? Thank you!!! Hi, I'm using an image for my web background, but I have a little problem. I have to go and size the image correctly in the image editing program for it to look right, but then if you resize the webpage it doesn't look right. Is there a way to make the image automatically resize itself depending on the size of the person's screen? How can I make the browser window that my site is in automatically have specific height/width dimensions? Making toolbar and scrollbar go away would also be nice. I've got an applet with some features, one of which a background image. It's actual size is 10.60 inches wide by 5.30 inches of height. Using WIDTH="744" and HEIGHT="600" (as shown on the code below) does not display the entire image. Can someone tell me the right setting of values to fix it? Is there a code to authomatically capture whatever the size of the .jpg and make it fit? Thanks in advance. Here's the html: <p align="center" <APPLET code=string WIDTH="744" HEIGHT="600"> <param name="para_back" value="background.jpg"> </APPLET> </p> Is there an HTML script that will automatically proportionately size a graphic? Say you set the Height=100 then the Width=?? would be automatically adjusted depending on the actual size of the parent graphic. Hi, I have made a site recently, its fairly dodgy looking but thats what they wanted, it all worked out well except for one of the pages the 'footer' section of the main table wont resize properly, all the pages are coded exactly the same for the section, but just one page wont work the site is www.thesavergroup.com and the page that wont behave is the eftpos page. Any help would be appreciated i'm going nuts over this. Thanks Chris How do I make this simple HTML/CSS page look the way I want? If you render this code in a browser, you will see what I'm trying to do. Thanks! Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN"> <html> <head> <title>Vertical Sizing Test Page</title> </head> <body style="margin: 0; background-color: #FFF; font-family: Verdana; font-size: 10pt;"> <div style="background-color: #FED; padding: 10px; height: 25px;"> Top Banner. I want this to be sized in pixels to accommodate raster backgrounds. </div> <div style="background-color: #DEF; padding: 10px; margin: 10px; border: 1px dotted black;"> <h2>Main Content Area</h2> I want this to vertically fill the remainder of the page.<br/> <br/> There should not be any unused space below the bottom banner.<br/> <br/> If there is a lot of dynamic content in this section, the user will need to scroll. However, if there isn't a lot of content, the user shouldn't have to scroll.<br/> <br/> This should also be vertically centered. </div> <div style="background-color: #FED; padding: 10px; height: 25px;"> Bottom Banner. I want this to be sized in pixels to accommodate raster backgrounds. </div> </body> </html> Hello. I have an HTML website image background that I am trying to stretch across any screen resolution, while keeping the image "fixed" in one position, so the image does not shrink when the screen window is modified. I got everything to work correctly, however I cannot get the image to stay at a "fixed size" when I shrink the window. Can somebody please help me? I am a beginner programmer, but I have tried numerous processes before resorting to this forum. Here is my code...in case you want to preview it in a web browser. Thanks in advance for any help you can offer me to get the image to stay "fixed" and also to keep it stretched across the entire screen. HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <!-- leave DTD out of DOCTYPE to put IE6 in quirks mode --> <html> <head> <title>GIS Disclaimer</title> <style type="text/css"> body { /* for IE; otherwise, BG isn't fully stretched */ margin: 0px; } #background { position: absolute; margin: 0px; border: 0px; padding: 0px; left: 0px; top: 0px; width: 100%; height: 100%; overflow: hidden; z-index: 0; background-repeat: no-repeat; background-attachment: fixed } #background img { padding: 0em; width: 100%; height: 100%; } #body { position: absolute; left: 0px; top: 0px; width: 100%; height:100%; padding: 0px; z-index: 0; } li { margin-bottom: 2em; } </style> <!--[if IE]> <style type="text/css"> body { margin: 0px; overflow: hidden; } </style> <![endif]--> </head> <!-- img must be encased in div to keep proper image aspect ratio --> <div id="background"><img src="file:///C:/Website/Images/Disclaimer_bckgd_5.jpg"></div> <div id="body"> <style fprolloverstyle>A:hover {color: red; font-weight: bold} </style> <div align="left"> <table cellspacing="0" cellpadding="0" align="center"><tr> <td width="100%" nowrap> <b><p style="word-spacing: 0in; line-height: 0px; margin-left: 0px; margin-right: 0px; margin-top: 175px; margin-bottom: 0px"; <span style="font-size:21.0pt; color:maroon" >Town of Leprechauns, Confusion<p style="word-spacing: 0in; line-height: 0px; margin-left: 0px; margin-right: 0in; margin-top: 40px; margin-bottom: 20px"; align="center"><b><span style="font-size:21.0pt;color:maroon">Online Disclaimer Form</span></b></p> </tr></table> <div align="left"> <table cellspacing="0" cellpadding="0" align="center"><tr> <td width="100%" nowrap> <p style="line-height: 0px; word-spacing: 0in; margin-left: 0px; margin-right: 0px; margin-top: 10px; margin-bottom: 0px"; align="left"><b><span style="font-size:12.0pt; color:black">This site provides access to the Online stuff. The information contained on this site is</p><p> updated periodically, however this town geographic database may NOT reflect the most current</p><p> information available. THE TOWN OF LEPRECHAUNS MAKES NO CLAIMS OR WARRANTIES,</p><p> EXPRESSED OR IMPLIED, CONCERNING THE COMPLETENESS, RELIABILITY, OR SUITABILITY </p><p> OF THESE DATA. THE TOWN OF LEPRECHAUNS DOES NOT ASSUME ANY LIABILITY ASSOCIATED</p><p> WITH THE USE OR MISUSE OF THIS INFORMATION. All information is for planning purposes only. </p><p> It may not be adequate for legal boundary definition, regulatory interpretation, or property conveyance</p><p> purposes. If you believe that any data provided within this site is inaccurate, or if you have any questions </p><p> regarding these data, please contact:</span></b></p> </tr></table> <table cellspacing="0" cellpadding="0" align="center"><tr> <td width="100%" nowrap> <p style="word-spacing: 0in; line-height: 100%; margin-left: 80px; margin-right: 0; margin-top: 0px; margin-bottom: 0"; align="left"><b><span style="font-size:12.0pt; color:maroon">Butch, GISP</span></b></p> <p style="word-spacing: 0in; line-height: 100%; margin-left: 80px; margin-right: 0in; margin-top: 0px; margin-bottom: 0"; align="left"><b><span style="font-size:10.0pt;color:maroon">Town of </span></b><b><span style="font-size:10.0pt;color:maroon">Leprechauns</span></b><b><span style="font-size:10.0pt;color:maroon"> </span></b><b><span style="font-size:10.0pt;color:maroon">GIS</span></b><b><span style="font-size:10.0pt;color:maroon"> Coordinator</span></b></p> <p style="word-spacing: 0in; line-height: 100%; margin-left: 80px; margin-right: 0in; margin-top: 0px; margin-bottom: 0"; align="left"><b><span style="font-size:10.0pt;color:maroon">41 Pot O Gold Road</span></b><b><span style="font-size:10.0pt;color:maroon">, </span></b><b><span style="font-size:10.0pt;color:maroon">Leprechauns</span></b><b><span style="font-size:10.0pt;color:maroon">, </span></b><b><span style="font-size:10.0pt;color:maroon">Confusion</span></b><b><span style="font-size:10.0pt;color:maroon"> </span></b><b><span style="font-size:10.0pt;color:maroon">90210</span></b></p> <p style="word-spacing: 0px; line-height: 100%; margin-left: 80px; margin-right: 0in; margin-top: 0px; margin-bottom: 0" align="left"><b><span style="font-size:10.0pt;color:maroon">Tel: </span></b><b><span style="font-size:10.0pt;color:maroon">555-555-5555</span></b><b><span style="font-size:10.0pt;color:maroon"> Fax: </span></b><b><span style="font-size:10.0pt; color:maroon; nowrap">555-555-5555</span></b><b> </b></p> <p style="word-spacing: 0px; line-height: 100%; margin-left: 80px; margin-right: 0in; margin-top: 0px; margin-bottom: 0"; align="left"><b><span style="font-size:10.0pt;font-family:"Times New Roman";mso-fareast-font-family: "Times New Roman";color:maroon;mso-ansi-language:EN-US;mso-fareast-language: EN-US;mso-bidi-language:AR-SA">Email:</span><span style="font-size:12.0pt; font-family:"Times New Roman";mso-fareast-font-family:"Times New Roman"; mso-ansi-language:EN-US;mso-fareast-language:EN-US;mso-bidi-language:AR-SA"> </span><span style="font-size:10.0pt;font-family:"Times New Roman";mso-fareast-font-family: "Times New Roman";color:blue;mso-ansi-language:EN-US;mso-fareast-language:EN-US; mso-bidi-language:AR-SA"><a href="mailto:bdawg9674@hotmail.com"><i><span style="color:navy">bdawg9674@hotmail.com</span></i></a></span></b></p> <p style="text-indent: 0; line-height: 250%; margin-left: 50px; margin-right: 0; margin-top: 0px; margin-bottom: 0"; align="left"><b>Do you agree to the conditions listed above?</b></p> <p style="text-indent: 0; line-height: 250%; margin-left: 50px; margin-right: 0; margin-top: 0px; margin-bottom: 0"; align="left"><font face=Arial size=-1 color=#000000><a href="http://xxxxx.xxxxxx.xxx.xxx/website/xxxxx/parcels/login.htm"><input type="submit" value=" I Agree " onclick= "parent.location='http://xxxx.xxxxx.xxx.xxx/website/xxxxx/Parcels/login.htm'" style="font-family: Georgia; color: #000080; font-weight: bold"></a></font><font face="Arial"> <a href="file:///C://Website/xxxx.html"> <input type="submit" value="I Do Not Agree" onclick= "parent.location='file:///C://Website/Survey.html'" style="font-family: Georgia; color: #000080; font-weight: bold"></a></font></p> </tr> </table> </div> </body> </html> Hi, I just got back into HTML and CSS and stuff for a new project after a lengthy absence. I'm also trying out PHP for the first time and having a lot of fun with it, but I'm having problems as usual. This doesn't have to do with PHP per se, but if PHP is involved in the solution that'd be just fine. By contrast, I'd like to avoid Javascript, since a lot of people have it disabled by default. One of the things that's always irked me about CSS is how it seems to be completely impossible to define an element's width/height based on its container's width/height without using percentages or without weird things happening when you use padding. Say I want to do one of the simplest things imagineable -- define a rectangular area within the page, with 25 pixels both to the left and right of it, and 12 pixels above and below it, no matter what the browser window's size is. While it's no task to set the rectangle's position relative to the body of the page (using left and top, or whatever), deciding its width or, particularly, height seems to be impossible. 100% - 25px is, sadly, not allowed, even if I incorporate PHP, since PHP has no way of telling what the 100% actually represents. I've been puzzling over this for the last couple hours, and after a great deal of fiddling with alignments, margins, padding, and such, these two pieces of really simple HTML are the best I could do, and they're both flawed: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style type="text/css"> <!-- body { margin: 0px; padding: 12px 25px 12px 25px; background-color: darkblue; } #inner_box { position: relative; width: 100%; height: 100%; background-color: lightblue; } --> </style> </head> <body> <div id="inner_box"> Text </div> </body> </html> Paste that into a HTML file to see what I'm talking about graphically. The problem here is clearly that, for whatever reason, the 100% height in inner_box doesn't activate and inner_box ends up only as high as a single line of text allows. I don't know why. But in this next example... Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style type="text/css"> <!-- body { margin: 0px; padding: 0px; background-color: darkblue; } #outer_box { position: absolute; margin: 0px; padding: 12px 25px 12px 25px; width: 100%; height: 100%; background-color: lightblue; } #inner_box { position: relative; width: 100%; height: 100%; background-color: white; } --> </style> </head> <body> <div id="outer_box"> <div id="inner_box"> Text </div> </div> </body> </html> Here I've fixed the problems with the first snippet by adding a new container (outer_box) with absolute positioning that covers the entire body area. inner_box goes inside it and tries to act like it did in the first example. Unfortunately, for some reason, outer_box doesn't act like the body tag did in the first example -- when padding is added to it in order to position the elements within it, outer_box expands itself instead of just resizing inner_box, like the body tag did. I've done a lot of experimenting and I simply can't find the solution. All I want is a page with a few pixels of blank space to all sides of a floating rectangle. I uploaded a couple of doctored image samples of what the page should look like, but doesn't: here and here. Anyway, in summation, this is driving me nuts. I know I could probably use Javascript to get the container (body or outer_box)'s width, and go from there, but like I said, I'd rather avoid Javascript. There has to be a better way to do this. Any help would be very welcome. EDIT: After some more experimenting, I've discovered something interesting. If I declare example 1's doctype to be: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> then it works properly. The same cannot be said for example 2. And I really can't tell why. I guess HTML forgives something that XHTML doesn't. Also, example 1 doesn't work if I include the HTML doctype's URL: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Strange. Anyway though, it's important to make example 2 work since I would usually be working with containers within containers, not just within the body tag. So I still haven't solved my problem. My site is he http://www.cteaguedsign.com/ and I want to kill that borderframe on the <iframe> tag, but neither "0" nor "no" seem to work. Please check the source and tell me if there's anything I can do to make it disappear in most browsers. 1) When creating a link to a new page you can contorl how the broswer appears. I mean so that address bar and such dont appear just the window. Sort of like a popup. I need to this for simiple HTML page that contains a swf file. I am unsure what code i need on the Herf link. "< A HREF="newwindow.html" TARGET="_blank">click to open help file< /A >" 2) can the same code be added to the top of the actaual window when it opens. Can you only do this went opening a new window. Hi there, When running a website from my Hard Drive or CD, the Active X message pops up, saying: "To help protect your security, Internet Explorer has restricted this file from showing active content that could access your computer. Click here for options..." I know that if you disable the Windows security, this message goes away. I would like this message to not pop up regardless of your security settings... much like the format /y command in the good ol' DOS days. Is there a command that will force the computer to accept the page without user intervention? Thanks in advance! I i have added dropdown list and associated label with it and i want to know the value for label and the value selected in dropdown list. How can I access both values inside javascript? can anybody help? |