Search Results

Search found 9661 results on 387 pages for 'div'.

Page 7/387 | < Previous Page | 3 4 5 6 7 8 9 10 11 12 13 14  | Next Page >

  • Replace # keyword from to the strings from the specified <div></div> using Jquery

    - by user568085
    Hi friends, I have problem to replace keyword from input string I have <div id="Wrap"> <span class="common"><div id="main0"> to test it #sky </div></span> </div> I want to like this : <div id="Wrap"> <span class="common"> <div id="main0"> to test <a href="http://mysite.com/search?q=#sky">#sky</a> </div> </span> </div> I tried with replace in jquery but not getting ... I finding solution in jquery or javascript Please help me... abhishek

    Read the article

  • Hovering a div shows hidden div - jquery to prototype conversion

    - by phil
    I may get killed for this but I have been trying for a few days using Prototype to show a hidden div when hovering over another div. I have this working fine in jquery but I could use some help porting it over to prototype. The code sample: <script type="text/javascript"> $(document).ready(function(){ $(".recent-question").hover(function(){ $(this).find(".interact").fadeIn(2.0); }, function(){ $(this).find(".interact").fadeOut(2.0); }); }); </script> <div class="recent-question"> <img src="images/new/img-sample.gif" alt="" width="70" height="60" /> <div class="question-text"> <h3>Heading</h3> <p><a href="#">Yadda Yadda Yadda</p> </div> <div class="interact" style="display:none;"> <ul> <li><a href="#">Choice1</a></li> <li><a href="#">Choice2</a></li> <li><a href="#">Choice3</a></li> </ul> </div> </div> So basically when I hover over a recent-question div i would like the div.interact to fade in or appear at all. The above code is for jquery but I am required to use prototype for this project. Any help converting would be greatly appreciated. Thanks!

    Read the article

  • Pull DIV from separate page and update DIV in current page

    - by brhea
    Hi everyone, I've got a simple one but haven't been able to find an example of a solution that fits exactly what I'm asking. Sorry in advance if this is a repeat. From my navigation menu, I want each link to reference a specific DIV in a separate page and then pull that DIV and replace the content in the current page. <ul> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> ..and so on </ul> Elsewhere in the page: <div id="displayContent">Content refreshes onClick. Previous content fades out, fresh content fades in.</div> Separate page (content.php): <div id="about">About content</div> <div id="contact">Contact content</div>

    Read the article

  • background semitransparent div

    - by plasticrabbit
    I want to show some dialog (absolute positioned div), and I want to show it above semitransparent 100% div, so everything on background will be dimmed. I have managed it by <div class='transpBox'></div> .transparentBox { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #white; opacity: 0.9; z-index: 499; } This is all right, but when dialog height is more than browser height and you scroll down, you see that transparent div is not in full screen. What is proper way to make such thing?

    Read the article

  • Expand <div> tag to bottom of page with CSS

    - by typoknig
    Hi all, I know this question gets asked a lot because I have looked at many "solutions" trying to get this to work for me. I can get it to work if I hack up the html but I want to use all CSS. All I want is a header with two columns below it, and I want these three items to fill the entire page/screen, and I want to do it with CSS and without frames or tables. The XAMPP user interface looks exactly how I want my page to look, but again, I do not want to use frames. I cannot get the two orangeish colored columns to extend to the bottom of the screen. I do have it so it looks like the right column extends to the bottom of the screen just by changing the body background color to the same color as the background color of the right column, but I would like both columns to extend to the bottom so I didn't have to do that. Here is what I have so far: HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html dir="ltr" xmlns="http://www.w3.org/1999/xhtml"> <head> <title>MY SITE</title> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> <link href="stylesheet.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="container"> <div id="masthead"> MY SITE</div> <div id="left_col"> Employee Management<br /> <a href="Employee%20Management.php">Add New Employee</a><br /> <a href="Employee%20Management.php">Edit Existing Employee</a><br /> <br/> Load Management<br /> <a href="Load%20Management.php">Log New Load</a><br /> <a href="Load%20Management.php">Edit Existing Load</a><br /> <br/> Report Management<br /> <a href="Report%20Management.php">Employee Report</a><br /> <a href="Report%20Management.php">Load Report</a></div> <div id="page_content"> <div id="page_content_heading">Welcome!</div> Lots of words</div> </div> </body> </html> CSS #masthead { background-color:#FFFFFF; font-family:Arial,Helvetica,sans-serif; font-size:xx-large; font-weight:bold; padding:30px; text-align:center; } #container { min-width: 600px; min-height: 100%; } #left_col { padding: 10px; background-color: #339933; float: left; font-family: Arial,Helvetica,sans-serif; font-size: large; font-weight: bold; width: 210px; } #page_content { background-color: #CCCCCC; margin-left: 230px; padding: 20px; } #page_content_heading { font-family:Arial,Helvetica,sans-serif; font-size:large; font-weight:bold; padding-bottom:10px; padding-top:10px; } a { color:#0000FF; font-family:Arial,Helvetica,sans-serif; font-size:medium; font-weight:normal; } a:hover { color:#FF0000; } html, body { height: 100%; padding: 0; margin: 0; background-color: #CCCCCC; }

    Read the article

  • How to keep a floating div centered on window resize (jQuery/CSS)

    - by Jimbo
    Is there a way (without binding to the window.resize event) to force a floating DIV to re-center itself when the browser window is resized? To help explain, I imagine the pseudocode would look something like: div.left = 50% - (div.width / 2) div.top = 50% - (div.height / 2) UPDATE My query having been answered below, I wanted to post the final outcome of my quest - a jQuery extension method allowing you to center any block element - hope it helps someone else too. jQuery.fn.center = function() { var container = $(window); var top = -this.height() / 2; var left = -this.width() / 2; return this.css('position', 'absolute').css({ 'margin-left': left + 'px', 'margin-top': top + 'px', 'left': '50%', 'top': '50%' }); } Usage: $('#mydiv').center();

    Read the article

  • selecting all text within a div on a single left click with javascript

    - by tstyle
    I have a simple non-clickable link within a div that looks like this: It's meant to be a sharable link that the user can copy paste into other things. For usability purposes, I want a single left click anywhere within the div to select the entire link: I don't know much about, javascript/web programming, so I've tried the following: <div id="share_link" onClick="select_all('share_link')"><%= request.url %></div> and this javascript <script type="text/javascript"> function select_all(id) { document.getElementById(id).focus(); } </script> This doesn't work. I'd like to know what's the simplest thing I should do to achieve what I want. I thought about changing the div to a text input or the text within to be a link, but ideally the content within should be read-only, non-editable, and non-clickable

    Read the article

  • Using jQuery.UI CSS Framework for DIV Styling

    - by Gordon
    Hi folks, a Project I am currently working on uses the jQuery UI framework for some of its widgets. To provide the user with a global look and feel I would like to use the framework also for its css stuff. I am implementing at the moment a dashboard like homepage, where the user can see an overall status of its data. This dashboard is build of some divs that should be aligned into a grid layout. I try to style the divs like follows <div class="ui-widget"> <div class="ui-widget-header">Box Header</div> <div class="ui-widget-content"> Content of the Box </div> </div> Later I would like to implement some draggable-and-sortable functionality. The Problem I am facing right now is that the boxes aren't properly aligned. Does anyone has a hint on using jQuery.UI for that kind of css work? I was studing the CSS framework documentation on jqueryui.com but there aren't that much information. best regards, Gordon

    Read the article

  • Div click and AUTOCOMPLETE password dialog problem

    - by ticky
    And what if you want to autocomplete passwords? I am using similar thing here... I am using Div (id=loginButton) and it has some image - I don't want button control in MVC application (), neither image button. I have hidden input control which is hidden button actually (id=submit_btn). So, on div's (id=loginButton) click, I want to call hidden input control (id=submit_btn) and it's submit action. HTML: <div id="loginButton" > </div> <input type="submit" style="display:none" name="submit" id="submit_btn" /> And JQuery: $(document).ready(function() { $('#loginButton').click(function() { $('#LoginForm').submit(); }); $("form[action$='HandleLoginForm']").submit(function() { Login(); return false; }); return false; }); Function Login() is working with Ajax, without downloading file dialog, but I need also auto complete passwords dialog. function Login() { var urlData = $("#LoginForm").serialize(); if (returnUrl != "") { urlData = $("#LoginForm").serialize() + "&returnUrl=" + returnUrl; } $.ajax({ url: $("#LoginForm").attr("action"), type: "POST", data: urlData, dataType: "json", success: function(result) { if (result.Content != null) { if (result.Valid) { window.location = result.Content.toString(); } else { document.body.innerHTML = result.Content.toString(); } } } }); return false; } It is easy when you use only <input type="submit"> instead of DIV. Form knows that it is for auto completing passwords, but if I use div and force hidden button click like in the code from below, it doesn't show autocomplete password dialog. $('#submit_btn').click(); It will not work. User is logged in, but no reminding for browser to store password. I need this.

    Read the article

  • Align div inline

    - by Rajeev
    How to make the second div inline to the first div.I need the flash swf to appear next to the tds <html> <div style="display: inline"> <table style="table-layout:fixed;width:100%;"> <tr> <td width ="20%"> </td> </tr> <tr> <td width="20%"> 1.Can you view the image? </td> <td width="20%"> 1.Can you upload the image? </td> </tr> </table> </div> <div style="display: inline;"> <object width="100" height="100"> <embed src="image_tr.swf" width="250" height="250"> </embed> </object> </div>

    Read the article

  • use a sprite png in li-class and display in div

    - by bonny
    hello i have some problem with displaying a sprite in a div that is in a li-class. so the structure is: <li id="aa"> <div><a href="#">one</a></div> </li> and the css: li{ width: 120px; height: 18px; margin-top: 5px; } li div{ width: 20px; height: 10px; background-image:url(../images/sprite.png) background-repeat: no-repeat; margin-left: 0px; font-weight:bolder; border: 1px solid #fff; } when i use this i can see the sprite even outside the div. so i tried adding to li background-image: none; that makes the image in the div not visible too. so if there is someone who know about that i really would appreciate. thanks alot.

    Read the article

  • Divs don't toggle

    - by stackoverflowuser
    I have following divs on my page <div id="rpttimeline">div 1</div> <div id="rptareaview">div 2</div> <div id="rptgalleria">div 3</div> <div id="rptremainingwork">div 4</div> <div id="rptremainingspec">div 5</div> <div id="rptremainingreq">div 6</div> <div id="rptremaininguserstory">div 7</div> Initially through css I have the first two divs set to visible and the remaining are hidden. in my document ready function I have $(document).ready(function () { window.setInterval(toggleDivs, 5000); }); function toggleDivs() { $('#rpttimeline').toggle(); $('#rptareaview').toggle(); $('#rptgalleria').toggle(); $('#rptremainingwork').toggle(); $('#rptremainingspec').toggle(); $('#rptremainingreq').toggle(); $('#rptremaininguserstory').toggle(); } when toggledivs is called the first two divs get hidden but the other divs are not visible. It seems the toggle is affecting just the first two divs. Am I missing something here?

    Read the article

  • jquery mouseent/leave to make div appears

    - by Blake
    I am looking to hover over my list item and have an effect similar to something like facebook chat is my best example..I am able to get the first div to appear but I believe this may be a selector issue because I cant get the rest working properly html <ul id="menu_seo" class="menu"> <li id="menu-seo"><span class="arrowout1"></span>SEO</li> <li id="menu-siteaudits"><span class="arrowout2"></span>Site Audits </li> <li id="menu-linkbuilding"><span class="arrowout3"></span>Link-Building</li> <li id="menu-localseo"><span class="arrowout4"></span>Local SEO</li> </ul> <div id="main_content"> <div id="menu-seo-desc"> <p>SEO management begins with a full website diagnosis of current web strategy Adjustments are made to improve your site’s ability to rank higher on search engines and draw more traffic </p> </div> <div id="menu-seo-desc2"> <p>Usability & site architecture review, Search Engine accessibility and indexing, Keyword research & targeting and Conversion rate optimization </p> </div> </div> css #menu-seo-desc { height:125px; width:210px; background-color:red; border-color:#CCC #E8E8E8 #E8E8E8 #CCC; border-style:solid; border-width:1.5px; border-radius:5px; box-shadow: 1px 0 2px 0px #888; -moz-box-shadow: 1px 0 2px 0px #888; -webkit-box-shadow: 1px 0 2px 1px #888; position:absolute; top:220px; left:350px; display:none; } js <script> $(document).ready(function(){ <script> $(document).ready(function(){ $('#menu_seo').on('#menu-seo', { 'mouseenter': function() { $('#menu-seo-desc').fadeIn(600); $('#menu-seo-desc2').fadeIn(600); }, 'mouseleave': function() { $('#menu-seo-desc').fadeOut(300); $('#menu-seo-desc2').fadeOut(300); } }); }); </script> });

    Read the article

  • swap a div to an embed form when user tweets using the @anywhere function box

    - by Jeff
    I'm using the @anywhere twitter function on the front page of my site (vocabbomb.com) and right now it works great to allow users to tweet straight away. Problem is, when they click tweet, it just reloads the twitter box, empty. I want it to load something new, like a "thank you, now fill in this email form" and show a mailchimp form. Ok so this is the @anywhere code currently working fine: <div id="tbox"></div> <script type="text/javascript"> twttr.anywhere(function (T) { T("#tbox").tweetBox({ height: 100, width: 400, defaultContent: " #vocabbomb", label: "Use the word foo in a tweet:", }); }); </script> So this is fine, and when the user writes a tweet, it just re-displays the twitter box. I understand there is a function that lets you specify stuff after the tweet is made: (example from http://dev.twitter.com/pages/anywhere_tweetbox) <div id="example-ontweet"></div> <script type="text/javascript"> twttr.anywhere(function (T) { T("#example-ontweet").tweetBox({ onTweet : function(plaintext, html) { console.log(plaintext); alert(html); } }); }); </script> Is this the best way to attempt this? Or do I need a function or something that changes what's in the div to something else? I want the mailchimp email form to show up after the tweet. It includes a ton of script and tags and starts like this: <!-- Begin MailChimp Signup Form --> <!--[if IE]> <style type="text/css" media="screen"> #mc_embed_signup fieldset {position: relative;} #mc_embed_signup legend {position: absolute; top: -1em; left: .2em;} </style> <![endif]--> <!--[if IE 7]> <style type="text/css" media="screen"> .mc-field-group {overflow:visible;} </style> <![endif]--> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" src="http://downloads.mailchimp.com/js/jquery.validate.js"></script> <script type="text/javascript" src="http://downloads.mailchimp.com/js/jquery.form.js"></script> <div id="mc_embed_signup"> <form action="http://faresharenyc.us1.list-manage.com/subscribe/post?u=106b58b4751a007d826715754&amp;id=2fe6ba4e6a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" style="font: normal 100% Arial, sans-serif;font-size: 10px;"> ... So my attempt to just require it inside the function didn't work at all: <div id="tbox"></div> <script type="text/javascript"> twttr.anywhere(function (T) { T("#tbox").tweetBox({ height: 100, width: 400, defaultContent: " #vocabbomb", label: "Use the word foo in a tweet:", onTweet: function(plain, html){ <?php require_once('mailchimp.html'); ?> } }); }); </script> Nettuts had a brief discussion here: http://net.tutsplus.com/tutorials/javascript-ajax/using-twitters-anywhere-service-in-6-steps/ I am seeing now that the 'onTweet' function simply adds some text above the twitter box, but doesn't actually replace the entire twitter box. How do I do that? Is it possible? Thanks!

    Read the article

  • how do I use html block snippets with dynamic content inside a django template that extends another

    - by stackoverflowusername
    Hi. Can someone please help me figure out a way to achieve the following (see snippets below) in Django templates? I know that you cannot use more than one extends, but I am new to django and I do not know the proper syntax for something like this. I want to be able to do this so that I can use my nested div layout for css reasons without having to type it like that each time and risking a typo. In words, I want to be able to have a page template extend my base.html file and then use html snippets of dynamic template content (i.e. template for loops or other template logic devices, not just a context variable I set from my view controller). ------------------------------------------------------------ base.html ------------------------------------------------------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <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>{% block title %}Title{% endblock %}</title> </head> <body> <div class="wrapper"> <div class="header"> This is the common header </div> <div class="nav"> This is the common nav </div> {% if messages %} <div class="messages"> <ul> {% for message in messages %} <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li> {% endfor %} </ul> </div> {% endif %} <div class="content"> {% block content %}Page Content{% endblock %} </div> <div class="footer"> This is the common footer </div> </div> </body> </html> ------------------------------------------------------------ columnlayout2.html ------------------------------------------------------------ <div class="twocol container2"> <div class="container1"> <div class="col1"> {% block twocol_col1 %}{% endblock %} </div> <div class="col2"> {% block twocol_col2 %}{% endblock %} </div> </div> </div> ------------------------------------------------------------ columnlayout3.html ------------------------------------------------------------ <div class="threecol container3"> <div class="container2"> <div class="container1"> <div class="col1"> {% block threecol_col1 %}{% endblock %} </div> <div class="col2"> {% block threecol_col2 %}{% endblock %} </div> <div class="col3"> {% block threecol_col3 %}{% endblock %} </div> </div> </div> </div> ------------------------------------------------------------ page.html ------------------------------------------------------------ {% extends "base.html" %} {% block content %} {% extends "columnlayout2.html" %} {% block twocol_col1 %}twocolumn column 1{% endblock %} {% block twocol_col2 %}twocolumn column 2{% endblock %} {% extends "columnlayout3.html" %} {% block threecol_col1 %}threecol column 1{% endblock %} {% block threecol_col2 %}threecol column 2{% endblock %} {% block threecol_col3 %}threecol column 3{% endblock %} {% endblock %} ------------------------------------------------------------ page.html output ------------------------------------------------------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <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</title> </head> <body> <div class="wrapper"> <div class="header"> This is the common header </div> <div class="nav"> This is the common nav </div> <div class="content"> <div class="twocol container2"> <div class="container1"> <div class="col1"> twocolumn column 1 </div> <div class="col2"> twocolumn column 2 </div> </div> </div> <div class="threecol container3"> <div class="container2"> <div class="container1"> <div class="col1"> threecol column 1 </div> <div class="col2"> threecol column 2 </div> <div class="col3"> threecol column 3 </div> </div> </div> </div> </div> <div class="footer"> This is the common footer </div> </div> </body> </html>

    Read the article

  • DIV is picking max-width value as width value for DIV.

    - by Lokesh
    I am facing a problem after applying max-width hack for IE7. In mozilla, width of the div is flexible and adjustable as per the image width in the div. But in IE7 it is taking the max-width as width of DIV. Below is my HTML code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <link rel="stylesheet" type="text/css" media="all" href="style/food.css" /> <!--[if IE 7]> <link rel="stylesheet" type="text/css" media="screen" href="style/ie7.css" /> <![endif]--> </head> <body> <div class="main_content_inner_ko"> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" alt="Big N&rsquo; Tasty"/><div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/><div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/> <div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/chicken/PremCrispyChickenRanchBLT.png" height="115" width="115" alt="Premium Cripsy Chicken Ranch BLT"/> <div class="small_title">Premium Cripsy Chicken Ranch BLT</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_images/x115/sandwiches/FiletOFish.png" height="115" width="99" alt="Filet O Fish"/> <div class="small_title">Filet O Fish</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="product_item"> <img src="images/product_icons/BigNTasty.png" height="115" width="99" alt="Big N&rsquo; Tasty"/> <div class="small_title">Big N&rsquo; Tasty</div> <table class="product_information" cellpadding="0" border="0" cellspacing="0"> <tbody> <tr> <td class="red_bold"></td> <td></td> <td class="small_italic">(Daily Value)</td> </tr> <tr> <td class="red_bold">Calories</td> <td>460</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Total Fat</td> <td>24g</td> <td class="small_italic">(37%)</td> </tr> <tr> <td class="red_bold">Carbs</td> <td>37g</td> <td class="small_italic">(12%)</td> </tr> <tr> <td class="red_bold">Protein</td> <td>24g</td> <td class="small_italic"></td> </tr> <tr> <td class="red_bold">Sodium</td> <td>720mg</td> <td class="small_italic">(30%)</td> </tr> <tr> <td colspan="3" class="notes">Note: Values shown are for the default size and/or flavor.</td> </tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_learn_more_and_customize"></a></td></tr> <tr><td colspan="3"><a href="#" class="acts_as_button en_add_to_my_meal_builder"></a></td></tr> </tbody> </table> </div> <div class="clear"></div> </div> </body> Below is the css code: div.small_title { font-size: 10px; color: #929292; text-align: center; max-width: 115px; line-height: 13px; padding-top: 5px; margin: 0 auto; } .product_item { position: relative; float:left; min-width: 35px; max-width: 189px; width: auto !important; text-align:center; border: 1px solid #CCC; } Please help me! Cheers!! Lokesh Yadav

    Read the article

  • Style list of divs as 2 column layout with css

    - by Anders Svensson
    I'm trying out ASP.NET MVC 2 by going through the "NerdDinner" tutorial. But apparently version 2 of MVC doesn't create a Details page the same as in the tutorial, and you get divs with css classes on them to style. However, I want to get the style where each label is followed on the same line with the field, and I can't do it, I get them on top of each other, or if I try using floats weird things happen (probably because I don't know exactly how to use it in this situation, where every other div should be on the same line). Here's the generated html for the Details page: <fieldset> <legend>Fields</legend> <div> <div class="display-label">DinnerID</div> <div class="display-field"><%: Model.DinnerID %></div> <div class="display-label">Title</div> <div class="display-field"><%: Model.Title %></div> <div class="display-label">EventDate</div> <div class="display-field"><%: String.Format("{0:g}", Model.EventDate) %></div> <div class="display-label">Description</div> <div class="display-field"><%: Model.Description %></div> <div class="display-label">HostedBy</div> <div class="display-field"><%: Model.HostedBy %></div> <div class="display-label">ContactPhone</div> <div class="display-field"><%: Model.ContactPhone %></div> <div class="display-label">Address</div> <div class="display-field"><%: Model.Address %></div> <div class="display-label">Country</div> <div class="display-field"><%: Model.Country %></div> <div class="display-label">Latitude</div> <div class="display-field"><%: String.Format("{0:F}", Model.Latitude) %></div> <div class="display-label">Longitude</div> <div class="display-field"><%: String.Format("{0:F}", Model.Longitude) %></div> <div class="display-label">IsValid</div> <div class="display-field"><%: Model.IsValid %></div> </div> </fieldset> How do I get the display-label and display-field for each "entry" to appear on the same line?

    Read the article

  • How can you force a floating div to be the height of its parent?

    - by ErnieStings
    HTML markup: <div class="planRisk"> <div class="innerPlanRiskRight"> <div class="rmPlanFrequency">10 </div> <div class="rmPlanSeverity"> 5</div> <div class="rmPlanRiskFactor">50 </div> <div class="rmPlanNumSolutions">2</div> <div class="rmPlanPercentComplete">34% </div> <div class="rmPlanDeletePlanRisk"> X </div> </div> <div class="rmPlanRiskTitle"> Pandemic Influenza</div> </div> CSS: .planRisk{background-color:#DEECD1; border:1px solid #BEBEBE;} .innerPlanRiskRight{float:right; color:#000000;} .rmPlanFrequency{float:left; width:46px;background-color:#d9dee1; text-align:center; border-right:1px solid #ebebeb; padding:0.2em;} .rmPlanSeverity{float:left; width:46px; background-color:#dbe1d4; text-align:center; border-right:1px solid #ebebeb; padding:0.2em;} .rmPlanRiskFactor{float:left; width:46px; background-color:#e5d5da; text-align:center; border-right:1px solid #ebebeb; padding:0.2em;} .rmPlanNumSolutions{float:left; width:46px; background-color:#dae4e4; text-align:center; border-right:1px solid #ebebeb; padding:0.2em;} .rmPlanPercentComplete{float:left; width:46px; background-color:#dddddd; text-align:center; padding:0.2em; } .rmPlanDeletePlanRisk{float:left; width:30px; background-color:#DEECD1; text-align:center; padding:0.2em;} .rmPlanRiskTitle{padding:0.2em; } .rmPlanSolutionContainer{background-color:#f0f9e8; border: 0 1px 1px; border-left:1px solid #CDCDCD; border-right:1px solid #cdcdcd; } .innerSolutionRight{float:right;} .rmPlanSolution{border-bottom:1px solid #CDCDCD; padding-left:1em;} .rmPlanSolutionPercentComplete{float:left; width:46px; background-color:#E2EADA; padding-left:0.2em; padding-right:0.2em; text-align:center;} .rmPlanDeleteSolution{float:left; width:30px; text-align:center; padding-left:0.2em; padding-right:0.2em; }

    Read the article

  • CSS: div text wrap around floated div

    - by Thildemar
    I am trying to create a site that has a fixed width content div and a floating div in the blank space on the right of the page, like so: <html> <div style="width:150px;float:right;border:thin black solid"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam.</div> <div style="width:400px"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </div> </html> This works fine, but when the page is re sized too small either the left div jumps down or the text within it does not start wrapping around the right div until its about halfway through it. I would like the test within the left div to wrap around the float is the page width is too small. What am I missing??

    Read the article

  • How to add divs inside a div using jquery

    - by Neal
    Hi, I am trying to insert a div inside another div using add() of jquery but it is not working " <div class="portlet" id="panel1"> <div class="portlet-header">1.Feeds</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> <div class="portlet" id="panel2"> <div class="portlet-header">2.News</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> " " <div class="portlet" id="panel3"> <div class="portlet-header">3.Shopping</div> <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> </div> " Actually panel1 and panel2 are inside a div, and panel3 is inside another div.I want to remove panel3 from its div and place it between panel1 and panel2 in their div.

    Read the article

  • div on other div

    - by Gisinior
    i have: <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <style type="text/css"> #ONE { background-color: #888; width: 500px; height: 500px; } #TWO { background-color: blue; width: 50px; height: 50px; } #THREE { background-color: yellow; width: 200px; height: 200px; display: none; } #four { background-color: red; width: 200px; height: 200px; } </style> <script type="text/javascript"> $(document).ready( function() { $("#TWO").click( function() { $("#THREE").toggle(); }); }); </script> <div id="ONE"><div id="TWO"></div><div id="four"></div><div id="THREE"></div></div> default click for blue div how can i it make? best with transparent :)

    Read the article

  • Cufon h2 on div hover

    - by SoulieBaby
    Hi all, I have h2 tags inside divs which I need to change colour on div hover, if the cufon is turned off, the h2 tag changes colour fine, but when cufon is turned on, it doesn't change colour. Here's my code: Cufon Cufon.set('fontFamily', 'DIN'); Cufon.replace('.listing_04 li a .bx1 .right .head_bx h2', { hover: true, hoverables: { a: true, div: true } }); CSS .listing_04 li a .bx1 .right .head_bx h2 { color: #e91397; font-size: 16px; padding: 0px; margin: 0px; } .listing_04 li a:hover .bx1 .right .head_bx h2 { color: #ffff00; } Code <div class="listing_04"> <ul> <li> <a href="#"> <div class="bx1"> <div class="left"> <img src="images/friends_only.jpg" alt="" border="0" class="img_border01" /> <div class="staring_bx"> <img src="images/star1.png" border="0" /> <img src="images/star1.png" border="0" /> <img src="images/star1.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /></div> </div> <div class="right"> <div class="head_bx"> <h2><strong>The Party Girls</strong></h2> My Favourites</div> <p> By : <b>Modi</b><br /> 19 Jan 2010 @ 20:20<br /> Views : <strong>1542484</strong><br /> Comments : <strong>84 </strong></p> </div> <div class="clear"></div> </div> </a> </li> <li> <a href="#"> <div class="bx1"> <div class="left"> <img src="images/img_07.jpg" alt="" border="0" class="img_border01" /> <div class="staring_bx"> <img src="images/star1.png" border="0" /> <img src="images/star1.png" border="0" /> <img src="images/star1.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /></div> </div> <div class="right"> <div class="head_bx"> <h2><strong>The Party Girls</strong></h2> My Favourites</div> <p> By : <b>Modi</b><br /> 19 Jan 2010 @ 20:20<br /> Views : <strong>1542484</strong><br /> Comments : <strong>84 </strong></p> </div> <div class="clear"></div> </div> </a> </li> <li> <a href="#"> <div class="bx1"> <div class="left"> <img src="images/resticted_image.jpg" alt="" border="0" class="img_border01" /> <div class="staring_bx"> <img src="images/star1.png" border="0" /> <img src="images/star1.png" border="0" /> <img src="images/star1.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /> <img src="images/star2.png" width="16" height="15" border="0" /></div> </div> <div class="right"> <div class="head_bx"> <h2><strong>The Party Girls</strong></h2> My Favourites</div> <p> By : <b>Modi</b><br /> 19 Jan 2010 @ 20:20<br /> Views : <strong>1542484</strong><br /> Comments : <strong>84 </strong></p> </div> <div class="clear"></div> </div> </a> </li> </ul> <div class="clear"></div> </div> Example URL: http://dev.splished.360southclients.com/test.php In this test I've disabled cufon for you to see that the h2 colour change works when you hover over the .bx1 div, click "turn cufon on" to see it with the cufon.

    Read the article

  • Triggering FancyBox from a DIV onclick();

    - by Tim
    Hello, This question seems to be asked a lot, but I haven't seen an answer that works. So I have a div that works like this: <div onclick="location.href='http://www.abc123.com';" class="menuitem"> </div> Now I need the link (specified in location.href) to open up in a fancybox iframe. I would love to use an A element but this div holds other items so I don't think I can. I am open to all suggestions... even using elements other than divs, or using a different jquery iframe lightbox. Thanks Tim Mohr

    Read the article

  • div layout format php

    - by Gully
    i am trying it get that div displaying 5 in a row and then start a new line and display more atm all that is happening is the are going under each other. CODE < div>Line1< br />Line2< br>Line3< /div> Thank you

    Read the article

  • Changing classes on multiple divs when selecting specific radio buttons

    - by Rob
    Hey everyone I got a javascript problem I can't seem to find a specific solution for on the web. What I want to be able to do is select one of the radio buttons and have that change the class of #home-right to either .rackmount or .shipping and add the class of .displaynone to the type of dimensions I don't want shown. <div id="home-right" class="rackmount"> <h4 class="helvneuebcn">Case Finder</h4> <div class="cta-options"> <input type="radio" value="Shipping and Storage" name="" checked> Shipping and Storage<br/> <input type="radio" value="Rackmount Enclosures" name=""> Rackmount Enclosures<br/> </div> <div class="shipping-dimensions displaynone"> <div class="dimensions"><input type="text" class="size"><span class="helvneuemd">H x </span></div> <div class="dimensions"><input type="text" class="size"><span class="helvneuemd">W x </span></div> <div class="dimensions"><input type="text" class="size"><span class="helvneuemd">L</span></div> </div> <div class="rackmount-dimensions"> <div class="dimensions"><input type="text" class="size"><span class="helvneuemd">U Height x </span></div> <div class="dimensions"><input type="text" class="size"><span class="helvneuemd">Rack Depth</span></div> </div> <div class="clear"></div> <input type="button" value="Submit" class="findcase"> </div>

    Read the article

< Previous Page | 3 4 5 6 7 8 9 10 11 12 13 14  | Next Page >