HTML - Drop Down Menu - Text Wrapping
Hello,
I have a drop down menu where one of the items is EXTREMELY long, and because of this, the overall size of the drop down box is the size of this item. I found a way to shrink the size of the drop down box via: <style type="text/css"> select {height: 12px; width: 50px; max-height: 12px} </style> This works in shrinking the overall size, but what happens is that the really long item is now longer than the width of the box and the text for the item doesn't wrap around down to the line below. So you don't actually see the whole item in the list. Do you know how I can wrap this item so that the text falls down to the line below? Cheers Similar TutorialsIs there a way to wrap text in a drop down selection box without increasing the height attribute? Otherwise very long text just cut off. Thanks. p.s. of course the solution should be compliant and especially work in the dreaded IE7. I thought I could remember , but I want to wrap my text using HTML. I forgot how, I am using tables and I want a picture inserted to the right. I have a pix for an example. TIA in firefox text wraps around the div, but in IE7 it pushes down. i've done everything correctly to the best of my knowledge. is this an IE7 bug or ? www.clipograph.com code: <?php if ($node->node_images) { ?> <!-- Node images --> <div class="node-images" rowspan="2"> <?php print $node->node_images ?><?php ?> </div> <?php }?> <div class="content"><?php print $content ?></div> CSS: .node .content { text-align: left; font-size: 0.85em; line-height: 1.3; min-height: 137px; } .node-images a img { margin-bottom: -3px; } .node-images { float: right; border: 1px solid #000; padding: 5px; margin-left: 10px; margin-top: 10px; } Hi all, I tried posting this under the CSS forum, but didn't get any answers, so I'm hoping for better success here. I don't know if this is a common issue or not, but it's giving me fits. I am trying to make an in-house employee directory for my company. It is a simple design, with the individual's picture displayed on the left of the page and their name and contact information flowing around it to the right of the image. When I use "float: left" in the style sheet, or even align="left" as an attribute in the img tag, it works beautifully in FF. But IE7 seems to want to make the image the same height as the first line of text, and only shows that much of it. If I use no formatting instructions, FF still displays it properly, but IE7 now displays the full image with the bottom aligned with the bottom of the first line of text and the remaining lines of text (each is produced with a br tag) below the image, rather than wrapped along the side. Unfortunately, although I like FF, my company uses IE7, so I need to find a solution. Any help would be greatly appreciated. The problem page can be viewed at: http://skmcbride.com/CHFA/employee_directory.php The style sheet is at: http://www.skmcbride.com/CHFA/_styles/mainstyle.css Thanks for you input, Steve For some strange reason if I want to have an ad or image on the left of my text article usually i put a div code around whatever it is like.. Code: <div style="DISPLAY: block; FLOAT: left; MARGIN: 0px 10px 0px 0px"> </div> This works GREAT in firefox but then i was shocked when i went over to Internet explorer and tested my site there using the latest browser.. it doesnt acknowledge that code and so the ad or the image ends up being above my article instead of nicely on the left and the text wrapped around it on the right like you see in firefox Any ideas how to get around this? Maybe a fix that works for ie. and firefox? thank you guys and gals in advance Hi there Anyone know how to force a long piece of link text to wrap on to the next line. Only seems to be a problem in FireFox. Here is the offending page: http://packlife.co.uk/news.asp By the way, the content is generated by the client via content management, otherwise I would stick in a <br />. Thanks, Kev Hello what is the HTML code for text wrapping, As whenever I put a html banner link to amazon, it puts it on the next line down And I would like it to appear at the side of text. So what is the html code for text wrapping? Thanks James Hi. I've been trying and failing at wrapping text around a mixpod playlist widget. [The widget is in a draft post I'm working on in a blog, not installed as a sidebar gadget.] I'm not technical, and the widget is "flash" technology which befuddles me even further. Fiddling with <div> and "align" codes, I was able to type in text next to the widget, but only in the editor page of Blogger...once I previewed or published it, the text appeared below the widget. I would very much appreciate anyone's ideas. The widget code is: <embed border="0" flashvars="mycolor=5C1400&mycolor2=baac8f&mycolor3=450101&autoplay=false&rand=0& f=4&vol=100&pat=0&grad=false" height="382" name="myflashfetish" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" salign="TL" src="http://assets.mixpod.com/swf/mp3/mff-nano.swf?myid=76126179&path=2011/01/26" style="height: 382px; visibility: visible; width: 165px;" type="application/x-shockwave-flash" width="165" wmode="transparent"></embed> Thank you. I'm making a form that contains three places for the user to enter text. The first two are for taking only one line of text, but the third is a bigger input for taking in multiple paragraphs of text. The trouble is, I can't get this third one to wrap the text! Is there a way to turn word wrapping on for an input bar? Or should I be using a different form element? I've found some help here already, so thanks in advance to the good folks that help us novices. I have just a couple that need addressing, but they're pretty important to me, so hopefully someone can spell them out. I'll explain them below but here's a quick rundown first: 1.) Wrapping text around a captioned image 3.) A pop-up text bar when a link is moused over. 1.) When I'm posting an image, a caption is almost always necessary. Here's the code I've been using for the image and caption: "<table class="image"> <caption align="bottom">CAPTION</caption> <tr><td><IMAGE LINK></td></tr> </table>" But when I post like that, there's a break between paragraphs to show the image, which disrupts the reading flow. I need a code that will let me post an image, add a bottom-aligned caption, and still have the story text appear alongside the image. NOTE: I've been shown the "align=left/right" code, but where do I insert that in the code listed above?? I've tried right before and right after the image source code, but to no avail. Help, please!! 2.) I'm willing to spend hours to learn this one. Somebody, somebody has to know how to do this one. It's done on this site! OK, here it is. You mouse over a post listing, and a text bar appears next to the cursor. In that bar is the first few lines of the person's post. HOW IS THIS DONE??? For someone looking to find new ways to boost hits on a news site, this is a priceless gem. If anyone knows how to do this or something similar in HTML, PLEASE let me know. Thanks in advance to each and every person who reads this, and a special thanks to those who take the time to help. It means much. aefattwotgm@aol.com Hi All! I would like to make a drop down box with all the departments of my company. Basically the user would select a dept and without refreshing or opening a new page the information would appear below. I have seen this before using a database but is there a way to do it without? Good day guys... is there anyone who can share about drop down menu's Id like to do a drop down menu similar to there's... is there any simple way of doing this?! Hi, Basically i have an index page with two frame, a navigation frame for the top and a main frame for the information, i have a drop down menu in the navigation frame. But the problem is, the drop down menu cant all bee seen when it drops over the main frame. Does anyone know a solution to this problem, i tried using an Iframe instead of normal frames, but that leaves a big gap between the end of the drop down menu and the start of the information. I have also tried using the <div> tags this also didnt help, i was wondering if there is a way to set the order in which the frames are displayed,so the navigation frame is displayed over the main frame. Any help would be great. Thanks for your time. mmarab. Hey guys, I need help making a drop down menu. I know how to make a basic one, but this is what I need... I want to have 4 drop down menus, with about 4 choices in each one. Under them I need a 'Submit" button. Basically, I need it so that any combination of the 4 choices in the 4 menus will open a specific page. For instance, lets say in menu 1 I pick the word "cat". In menu 2, I pick the word "dog". In menu 3 I pick the word "car". In menu 4 I pick the word "tree". Once I click submit, a page with a picture of a cat, dog, tree and car would open up. (I would provide all the possible different pictures). So how would one do this? Any help is GREATLY appreciated, thanks! I have the following drop down menu. HTML Code: <form> <select name="menu" style="font-family:'Arial';color:#FFFFFF;background-color:#000000;font-size:10pt;"> <option value="no link no action">title of menu</option> <option value="url 1">link 1</option> <option value="url 2">link 2</option> <option value="url 3">link 3</option> <option value="url 4">link 4</option> </select> <input type="button" onClick="location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO" style="font-family:'Arial';color:#FFFFFF;background-color:#000000;font-size:10pt;"> </form> Here is a screen capture of what the menu looks like. It's at this point I want no action to take place when "go" is clicked. As it is now (above code) it refreshes current page. My question is how do I change this so that the first "option" has no action when chosen and then "go" is clicked. As is is right now it refreshes the current page being that between the quotes <option value=" HERE ">title of menu</option> there isn't a link because I don't want this option to do anything. Basically when the drop down menu shows "title of menu" and I click on "go" I want nothing to happen instead of a refresh. Dear HTML Experts, I need your help, I would love to have a dropdown menu. Which drop out of a image? Like when your mouse is at the image, the menu shows up vertically? Thanks Hey, Kinda new to this so bare with me. Im using Trellian web page to do some updating on our companies' website and they just asked me to make up a sort of parts catalog for our inventory we have here. I thought the best way for the person visiting the website to find the parts they need is to have drop down menus.Ive been trying so hard to make this but i just keep failing. This is what i want to do. The first one would ask "Make..." they would click that and scroll down the list to find the Make of their machine. Once they click their machine, another drop down menu would appear underneath of that asking the model and the menu would contain all the models associated with the make of the machine. And i want to have another one appear under that once they click on the model. Is there anything or any place where i can find a nice tutorial on how to make this dream come true.....? something like this http://www.wengers.com/Parts/TractorParts.aspx Hai everybody.. I want to create a html drop down menu. I created a menu using template toolkit, but i want to create this in html code.Caan anyone help. Pls find here what i done. { title = 'Enterprise Name' type = 'select' dropdown_field = arr_Ent_NameId (This is the array which contains all the data i.e enterprise name. name = 'ent_id' } How can i do this in html. In the select and value button , how can i use this array Hello im looking for a script for my website that offers the following I have an image link, that I want to rollover to another image (Of the text glowing) then have a drop down menu pop up below it that can have other menus drop down from that one.) Right now Im trying a Javascript that I found for free on the internet but i cant seem to get it working. http://javascript-array.com/scripts/...rop_down_menu/ But I cant get it to be a rollover image instead of a text box. and it doesnt support multiple drop downs like this one: http://javascript-array.com/scripts/..._down_menu/?sb plus they want you to pay for it, and im looking for a free solution. Any help appreciated, thanks. |