Search Results

Search found 2756 results on 111 pages for 'padding'.

Page 85/111 | < Previous Page | 81 82 83 84 85 86 87 88 89 90 91 92  | Next Page >

  • Click outside menu to close in jquery

    - by George
    So I have a drop-down menu that shows on a click, as per business requirements. The menu becomes hidden again after you mouse away from it. But now I am being asked to have it stay in place until user clicks anywhere on the document. How can this be accomplished? This is a simplified version of what I have now: $(document).ready(function() { $("ul.opMenu li").click(function(){ $('#MainOptSubMenu',this).css('visibility', 'visible'); }); $("ul.opMenu li").mouseleave(function(){ $('#MainOptSubMenu',this).css('visibility', 'hidden'); }); }); <ul class="opMenu"> <li id="footwo" class=""> <span id="optImg" style="display: inline-block;"> <img src="http://localhost.vmsinfo.com:8002/insight/images/options-hover2.gif"/> </span> <ul id="MainOptSubMenu" style="visibility: hidden; top: 25px; border-top: 0px solid rgb(217, 228, 250); background-color: rgb(217, 228, 250); padding-bottom: 15px;"> <li>some</li> <li>nav</li> <li>links</li> </ul> </li> </ul> I tried something like this $('document[id!=MainOptSubMenu]').click(function() thinking it would trigger on anything that wasnt the menu, but it didnt work.

    Read the article

  • ObjectiveFlickr - how to call getSizes on a photo ID not known until the response?

    - by Jonathan Cohen
    Hi guys, I'm building a free music instrument iPhone app with the Flickr API and ObjectiveFlickr.A random photo from the interestingness list is displayed in the background, but I can't center it without knowing its size. (so I can reset the UIWebView frame) I've been researching this for awhile, and if the answer is super easy, please have some mercy on a noob - it's my first time playing with a web service API. =) Since I don't know the photo ID until after I receive the response from the interestingness feed, how would I call flickr.photo.getSizes on the response? This is what I have so far: - (void)flickrAPIRequest:(OFFlickrAPIRequest *)inRequest didCompleteWithResponse:(NSDictionary *)inResponseDictionary{ int randomResponse = arc4random() % 49; photoDict = [[inResponseDictionary valueForKeyPath:@"photos.photo"] objectAtIndex:randomResponse]; NSString *photoID = [photoDict valueForKeyPath:@"id"]; NSLog(@"%@",photoID); NSURL *photoURL = [flickrContext photoSourceURLFromDictionary:photoDict size:OFFlickrMediumSize]; NSString *htmlSource = [NSString stringWithFormat: @"<html>" @"<head>" @" <style>body { margin: 0; padding: 0; } </style>" @"</head>" @"<body>" @"<img src=\"%@\" />" @"</body>" @"</html>" , photoURL]; [webView loadHTMLString:htmlSource baseURL:nil]; }

    Read the article

  • gwtQuery's outerWidth(true) and IE8 not working without putting a delay

    - by Christopher
    I recently came across an odd behavior when trying to calculate the width (with margins) of an element using gwtQuery. The goal is to get the width (including padding, borders and margins) of a given element as a child of a certain parent. This parent may define specific CSS rules for some children so I clone it, add my element to this parent, call .outerWidth(true) to get the width and finally remove the clone from the parent. It works fine on Chrome, Firefox and IE 10, but randomly fails (outputs 0) on IE 8. However I noticed that if I put a "sleep" between the moment I add the element to the DOM and the moment I get the outer width, it always succeeds. I obviously don't want to keep that sleep. So my question is does anyone has any insights on how to work around this behavior or even a better way of achieving the same goal? Thank you! Here's a code snippet private Integer computeTabWidth(IsWidget tab) { GQuery $tab = $("<li></li>").append($(tab).clone()); $(containerPanel).append($tab); // IE 8 debug. sleep(100); Integer tabWidth = $tab.outerWidth(true); $tab.remove(); return tabWidth; } private void sleep(int i) { long time = new Date().getTime() + i; while (time > new Date().getTime()); }

    Read the article

  • Vertically and horizontally align

    - by user1760649
    My problem is the following: I've vertically centered a div. However, I'd like to center another div horizontally. The problem is that I don't manage to center it horizontally. Here are my (X)HTML and CSS (X)HTML: <body> <div id="strut"></div> <div id="page"> <div id="inner_page"> <h1>Galidie "jQzz" Clément</h1> </div> </div> CSS: html, body { margin: 0; padding: 0; height: 100%; } #strut, #page { display: inline-block; vertical-align: middle; } #strut { height: 100%; } #page { border: 1px solid #c00; } #inner_page { width: 750px; margin: 0 auto; background-color: #c00; } h1 { text-align: center; margin: 0; } strut is the marker for vertically center an element. page is centered vertically. The idea is to try to center horizontally the inner_page block. Should I use absolute position? Or anything else? Did I choose the good method? Thank for your futur help.

    Read the article

  • How do you detect when the Flowplayer has started playing the video?

    - by Alex
    Hi. I'm using the Flowplayer Flash video player to play MP4 videos inside an AnythingSlider. I need to detect when the user has clicked the start button on the video so to stop the slideshow and allow the user to view the video. I've tried using this code just to get an alert box but it doesn't do anything (the code is at the end of the page, before the closing </body> tag): <script type="text/javascript"> $f("player","global/js/flowplayer/flowplayer-3.1.5.swf",{ onStart: function(clip) { alert('player started'); } }); </script> The Flowplayer is implemented as part of the html5media library, which automatically detects whether the browser can handle the <video> tag; if not, it replaces the anchor tag below with the Flowplayer: <video id="vid" width="372" height="209" poster="global/vid/bbq-poster.jpg" controls preload> <source id="videoSource" src="global/vid/BBQ_Festival.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' onerror="fallback(this.parentNode)" ></source> <a href="global/vid/BBQ_Festival.mp4" style="display:block;width:372px;height:209px; padding-left:5px; " id="player"> </a> </video> So the $f() function call is in a JavaScript block at the end of the page, to give the player a chance to load correctly. What am I doing wrong? Thanks.

    Read the article

  • css: make background repeat-y with growing child content?

    - by mikemikemike
    I Have a three column layout. The center div is a container which holds all of my content. The outer columns is just a .png that fades into the body's background (left and right respectively). I want the .png to repeat-y to grow with the center container's content. It will only print the image once, and ignores the repeat-y. If I specify a height to the outside columns, it will print, but only to the specified height. I tried height: 100%, which does not work. Here is my code: #ultra_contain { text-align:left; width:900px; padding: 0px; position:relative; margin:0px auto; margin-top:0px; /*border:1px dashed #996;*/ } #gradientleft { float:left; position:relative; background: url("../i/gradient_left.png") repeat-y; /*border:1px dashed #996;*/ } #gradientright { float:right; position:relative; background: url("../i/gradient_right.png") repeat-y; /*border:1px dashed #996;*/ } #container { text-align:left; width:700px; position:relative; margin:5px auto; margin-top:0px; background:#fff; /*border:1px dashed #996;*/ }

    Read the article

  • HTML table with auto-fit for some columns, fixed width for others

    - by sangil
    I'm trying to create a table adhering to the following requirements: The table width must be defined as 0 - the browser should calculate the width according to the column widths (this is to accommodate a column-resize plugin). Some columns may receive a fixed width (e.g. 50px); Columns that do not receive a fixed width, must auto-fit to the content. I have created a small example to illustrate the problem - as you can see column 3 stays at width 0 and so is not visible. HTML <table> <tr> <td class="cell header" id="header1">Header 1</td> <td class="cell header" id="header2">Header 2</td> <td class="cell header" id="header3">Header 3</td> </tr> <tr> <td class="cell">Cell 1</td> <td class="cell">Cell 2</td> <td class="cell">Very looooong content</td> </tr> </table> CSS table { table-layout: fixed; width: 100%; border: 1px solid #696969; } .cell { color: #898989; border: 1px solid #888; padding: 2px; overflow: hidden; } .header { background-color: lightsteelblue; color: black; } #header1, #header2 { width: 50px; } Is this even possible? Any help would be appreciated...

    Read the article

  • Presentation Issue in an Unordered List

    - by phreeskier
    I'm having an issue with correctly presenting items in an unordered list. The labels are floating left and the related spans that are long in length are wrapping and showing below the label. I need a solution that keeps the related spans in their respective columns. In other words, I don't want long spans to show under the labels. What property can I take advantage of so that I get the desired layout in all of the popular browsers, including IE6? Thanks in advance for the help. My code is as follows: <ul> <li> <label>Name</label> <span><%= Html.Encode(Model.Name) %></span> </li> <li> <label>Entity</label> <span><%= Html.Encode(Model.Entity) %></span> </li> <li> <label>Phone</label> <span><%= Html.Encode(Model.Phone) %></span> </li> </ul> My CSS styling is as follows: ul { display:block; list-style-type:none; margin:0; padding:0; } ul li label { float:left; width:100px; }

    Read the article

  • Position absolute for rounded corners and problems in IE6

    - by danit
    Im using position absolute to give the top left corner of a DIV a rounded corner. HTML: <div id="MyDiv"> Some content <div class="topLeft">&nbsp</div> </div> CSS: #MyDiv { position: relative; padding: 12px; background: #fff url('graident.png') repeat-x top left; } .topLeft { position: absolute; top: 0; right: 0; width: 10px; height: 10px; background: transparent url('corner.png') no-repeat top right; } This works fine in all browsers expcept IE6. In IE6 the corner.png image seems to be about 1px out at the top corner, essentially not top: 0; and right: 0; but more like top: 1px; right: 1px; Can anyone explain why this might be happening only in IE6?

    Read the article

  • how can i have a working dropdownlist with links from a csv in php

    - by Mark Dekker
    I have a website that loads a CSV, divides it into parts, and shows these parts. There are 7 parts, and since it is for a music store it is sliced like this: the name of the product the subname the price the stock in one shop the stock of the other shop the group name the brandname What i have now is that it shows 12 products on 1 page, with a next and previous link on top of the page. The pages are made with the group name, every group has it's own page, so you have a drums page, guitar page, speaker page. That all works great. What i programmed in there is a dropdownlist, it drops down a list of brandnames, which should narrow the search for a person who is looking at the products. Problem is right now, that the dropdown menu works, i see the brands, but they are NONE clickable, only the brands that are currently on the page are shown, so NOT all the brands from that group are shown, only the 12 that are currently showing, when you press next, it shows 12 more brands, but i want them to be shown right on the start. And the third problem is, when it is showing the brands, it shows them double or triple, depending on how many products have the same brand. Is there a way what i want, with this code as a basis ? <html> <body bgcolor=#E2E965 link=black vlink=black alink=black text=#D5DF23> <style type="text/css"> #nav, #nav ul { padding: 0; margin: 0; list-style: none; } #nav li { float: left; width: 120px; } #nav ul { position: absolute; width: 120px; left: -1000px; } #nav li:hover ul { left: auto; } <!-- a {text-decoration:none} //--> body { scrollbar-arrow-color: #E2E965; scrollbar-face-color: #D7182A; scrollbar-highlight-color: #000000; scrollbar-3dlight-color: #D6DF23; scrollbar-shadow-color: #00000; scrollbar-darkshadow-color: #00000; scrollbar-track-color: #D6DF23; } input:link {text-decoration: none; color: #E2E965;} input:visited {text-decoration: none; color: #E2E965;} input:active {text-decoration: none; color: #E2E965;} .spacer_black { margin: 0px; padding: 0px; border: 5px; height: 2px; width: 100%; line-height: 0px; font-size: 0px; background-color: #000000;} </style> <table width=800 border=0><td> </html> <?PHP $offset = isset($_GET['offset'])?$_GET['offset']:0; $LinesToDisplay = 12; $row = $offset + $LinesToDisplay; $row2 = $offset - $LinesToDisplay; $file_handle = fopen("web.txt", "rb"); error_reporting( E_ALL ); // DEBUGGING $SelectArray=array(); while ((($parts = fgetcsv($file_handle,4096,"|")) !== FALSE) && ($LinesToDisplay > 0) && (!feof($file_handle))) { //new code //skip first $offset lines $num = count($parts[6]); $SelectArray[]=$parts[6]; if ($parts[5] == 9999) { if ($offset-- > 0) {continue;} $parts[0] = ucwords(strtolower($parts[0])); $parts[1] = ucwords(strtolower($parts[1])); ?> <td> <?php echo "<table BACKGROUND='background.jpg' border=0 width=250><td width='243' height='105'>"; echo "<font size=-1 face='helvetica' color=#812990><b>$parts[0]</b></font>"; echo "<i>"; ?> <html> <div onMouseOver="this.style.color = 'black';" onMouseOut="this.style.color = '#D5DF23';"> </html><?php echo "<font size=2>-$parts[1]</font>"; echo "</div></i>"; ?><html><a href="#" title="Koop nu de <?php echo $parts[0]; ?>" onClick="window.open('form.php?p=<?php echo urlencode($parts[0]); ?>','popuppage','width=400,height=400,top=250,left=250,resizable=0,statusbar=0,titlebar=yes,toolbar=no,scrollbars=no,location=no,directories=no');"> <div><img src='ster.jpg' border=0 width='46' align='right'></a> <a href="#"><img src='envelope.jpg' border=0 width='46' align='right'title="Heeft u een vraag over <?php echo $parts[0]; ?>" onClick="window.open('vraag.php?p=<?php echo urlencode($parts[0]); ?>','popuppage','width=400,height=400,top=250,left=250,resizable=0,statusbar=0,titlebar=yes,toolbar=no,scrollbars=no,location=no,directories=no');"> <div></a> <TABLE BORDER='0' cellpadding='0' CELLSPACING='0'> <TR> <TD WIDTH='70' HEIGHT='20' BACKGROUND='pricebackground.jpg' VALIGN='bottom'> <center> <font size=2 color=white face='helvetica'> <b></html> <?php echo "€ $parts[2]"; ?> </b> </td> </tr> </table> <?php echo "<b><font size=3 color=#D7182A>Op Voorraad In:<br></font>"; echo ("<font color=black> Amsterdam </font>"); if ( $parts[3] >= 1 ) echo ("<IMG SRC =green.gif>").""; if ( $parts[3] <= 0 ) echo ("<IMG SRC =red.gif>").""; echo ("<font color=black> Utrecht </font>"); if ( $parts[4] >= 1 ) echo ("<IMG SRC =green.gif>")."</td></table></b><p style='margin:9px;'>"; if ( $parts[4] <= 0 ) echo ("<IMG SRC =red.gif>")."</td></table></b><p style='margin:9px;'>"; $LinesToDisplay--; if ($LinesToDisplay/3==intval($LinesToDisplay/3)) { echo "<tr><td>"; } }} fclose($file_handle); ?> <tr align=right> <select style="background-color: #FFFFFF; color: #000000; font-family: Arial; font-weight: none; font-size: 12; width: 150px; "> <?php $i=1; foreach ($SelectArray as $val){ echo "<option value=\"$i\">$val</option>\n"; $i++; } ?> </select> <font color=black><body alink=black vlink=black link=black text=black> <center><a href="occasiona.php?offset=<?php echo $row2; ?>" align=center>&laquo; previous</a> || <a href="occasiona.php?offset=<?php echo $row; ?>">next &raquo;</a></table></html>

    Read the article

  • How to make HTML layout whitespace-agnostic?

    - by ssg
    If you have consecutive inline-blocks white-space becomes significant. It adds some level of space between elements. What's the "correct" way of avoiding whitespace effect to HTML layout if you want those blocks to look stuck to each other? Example: <span>a</span> <span>b</span> This renders differently than: <span>a</span><span>b</span> because of the space inbetween. I want whitespace-effect to go away without compromising HTML source code layout. I want my HTML templates to stay clean and well-indented. I think these options are ugly: 1) Tweaking text-indent, margin, padding etc. (Because it would be dependent on font-size, default white-space width etc) 2) Putting everything on a single line, next to each other. 3) Zero font-size. That would require overriding font-size in blocks, which would otherwise be inherited. 4) Possible document-wide solutions. I want the solution to stay local for a certain block of HTML. Any ideas, any obvious points which I'm missing?

    Read the article

  • Vertically align a heading and a paragraph in a div

    - by davey
    I'm trying to vertically align a h1 element and p in the middle of a div floated left but they end up next to each other vertically aligned. Im pretty sure it to do with the table-cell display but don't know how to vertically align without it. my code gives me: . . Heading Paragraph . . I want: . . Heading Paragraph . . heres my code: CSS: #HDRtext { float: left; width: 30%; height: 335px; padding: 0; display: table; color: white; } #HDRtext h1 { font-family: Georgia; font-size: 2em; display: table-cell; vertical-align: middle; } #HDRtext p { display: table-cell; vertical-align: middle; font-size:1em; font-family: Georgia; }

    Read the article

  • Problems solving oddly acting labels in ie7.

    - by Qwibble
    Okay so this is sort of a double question so I'll split it into two. First part In modern browsers the main bold labels sit above their corresponding form elements, and align to the left as is expected. However in ie7, they randomly site 10-15px inset. I went through the developer tools and could find nothing to fix it. I've made sure all my margins and padding is reset so I don't really understand =S Here's the page demo - link Maybe some of you ie bug fixing genius's know what the problem is? =D Second part Again with labels, this time the in-line ones resident next to the check boxes and radio buttons. In modern browsers again, the side beside the form elements as expected, but not so in ie7 where they take a new line. I've tried floating, changing margins and everything but to no effect in sitting it in-line with the div.checker or div.radio that is created by the uniform Jquery plugin. Here's the page demo - link Sorry for troubling you with my ie7 problems, I know they arent the most fun to solve. Hopefully someone has the patience to help. Matt

    Read the article

  • #nav css affecting all elements in page.

    - by Sam Gabriel
    Hey guys I set up this CSS file to use on the navbar: #nav { background-color: #98bf21; } #nav li { float:left; } #nav li ul{ position: absolute; width: 172px; left: -999em; } #nav li:hover ul{ left: auto; } #nav a:link,a:visited { display:block; width:164px; font-weight:bold; color:white; background-color:#98bf21; text-align:center; padding:4px; text-decoration:none; text-transform:uppercase; } #nav a:hover,a:active { background-color: #7A991A; } And it seems to be affecting all the elements. For example all elements take the styles if the #nav a styles. Is there something I'm missing here? I'm new to web design.

    Read the article

  • CSS- How to align background image over bottom border line? Jsfiddle included

    - by John Robinson
    I have an image I am trying to display over the top of a bottom border, but it is being arranged behind the bottom border element (in this example, named "divider"), and I can't get it to align correctly. I would like the image to be displayed in the middle of the the border element and over the top of it. Vertically, I am trying to get the 1px line on the left and right side of the image to align with the 1px border to appear as if it is one element. Here is the code: .divider { border-bottom: 1px solid #c3c3c3; clear: both; display: block; margin-bottom: 20px; padding-top: 20px; width: 100%; } .sidearrow { background: url(http://s16.postimage.org/sbf7v9n75/sidearrow.png) 50% 14px no-repeat; width: 100%; height: 25px; }? <p>Here is some content above</p> <div class="sidearrow"></div> <div class="divider"></div> <p>Here is some content below</p>? And the jsfiddle: http://jsfiddle.net/F5xjx/2/ Any ideas how to get this to work? Thanks in advance.

    Read the article

  • How to force div to appear below not next to another?

    - by Vafello
    I would like to place my div below the list, but actually it is placed next to the list.The list is generated dynamically, so it doesn't have a fixed hight. I would like to have the map div on the right, and on the left (next to the map) the list placed on top and the second div below the list. #map { float:left; width:700px; height:500px; } #list { float:left; width:200px; background:#eee; list-style:none; padding:0; } #similar { float:left; width:200px; background:#000; } <div id="map"></div> <ul id="list"></ul> <div id ="similar"> this text should be below, not next to ul. </div> Any ideas?

    Read the article

  • Problems with my HTML/CSS

    - by Michael
    Note below is my CSS. This is a three column website. my main content is in the center. The problems that I am having is that my main content does not adjust correctly to IE. It is fine in FF but not in IE. .columns3headers2 #mainContent1 { margin: 0 22% 0 24%; width: 570px; background-color: #DDDDDD; height: 370px; padding: 0, 10, 0, 0; border: groove } .columns3headers2 #mainContent2 { margin: 0 22% 0 24%; width: 570px; background-color: #DDDDDD; height: 190px; border: groove } I do not have much in my main content. <div id="mainContent1"> <h1> Main Content </h1> <div id="cround"> <h3>Absolute Value</h3> <ul> <li>Test 1</li> <li>Test 2</li> <li>Test 3</li> <li>test 4</li> </ul> </p> </div>

    Read the article

  • How to Implement Custom List View for the list Items in Android Application

    - by avadhani
    I had a problem with the list view having both parent list and the child list of the list activity(implemented through database query). I wish to show them differing their properties by changing the text style (parent list items are in bold, child list items are in normal style). The following is the code from which all the child and parent list items having the same style(bold): String sql = "SELECT Parentid,Childid,Name from (select com.Parentid, com.Childid, com.Name from table1 mem inner join table2 cd on mem.column1=cd.column1 inner join table3 com on com.childid = mem.childid where Parentid is NULL UNION SELECT com.Parentid, com.Childid,com.Name from table1 mem inner join table3 com on com.childid = mem.childid inner join table2 cd on mem.column1=cd.column1 where Parentid is NOT NULL) a group by Parentid, Childid;"; Cursor cdata = myDbHelper.getView(sql); and the List Adapter is: private static final String fields[] = {"Name"}; int[] names = new int[] {R.id.name}; SimpleCursorAdapter adapter2 = new SimpleCursorAdapter(this,R.layout.clientlist1, cdata, fields,names ); and the clientlist.xml is: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/MainLayout" android:padding="5px"> <TextView android:id="@+id/name" android:layout_alignParentRight="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textSize="12sp" android:textColor="#104082" android:textStyle="bold" android:layout_weight="1" /> From this i am getting the list having the complete list having both parent and child list items in a single list view. I wish to differ in their text style(bold, normal) for parent and child items respectively. Please help me with the code/links. Thanks a lot in advance.

    Read the article

  • Update graph in real time from server

    - by user1869421
    I'm trying to update a graph with received data, so that the height of the bars increase as more data is received from the server via a websocket. But my code doesn't render a graph in the browser and plot the data points. I cannot see anything wrong with the code. I really need some help here please. ws = new WebSocket("ws://localhost:8888/dh"); var useData = [] //var chart; var chart = d3.select("body") .append("svg:svg") .attr("class", "chart") .attr("width", 420) .attr("height", 200); ws.onmessage = function(evt) { var distances = JSON.parse(evt.data); data = distances.miles; console.log(data); if(useData.length <= 10){ useData.push(data) } else { var draw = function(data){ // Set the width relative to max data value var x = d3.scale.linear() .domain([0, d3.max(useData)]) .range([0, 420]); var y = d3.scale.ordinal() .domain(useData) .rangeBands([0, 120]); var rect = chart.selectAll("rect") .data(useData) // enter rect rect.enter().append("svg:rect") .attr("y", y) .attr("width", x) .attr("height", y.rangeBand()); // update rect rect .attr("y", y) .attr("width", x) .attr("height", y.rangeBand()); var text = chart.selectAll("text") .data(useData) // enter text text.enter().append("svg:text") .attr("x", x) .attr("y", function (d) { return y(d) + y.rangeBand() / 2; }) .attr("dx", -3) // padding-right .attr("dy", ".35em") // vertical-align: middle .attr("text-anchor", "end") // text-align: right .text(String); // update text text .data(useData) .attr("x", x) .text(String); } useData.length = 0; } } Thanks

    Read the article

  • IE6 ignoring active link CSS style

    - by Leah
    The CSS active link style is being correctly applied in IE7, FF, and Safari but is not applied IE6. .side_nav a.active { color:#FFFFFF; background-color:#9F1F63; } Interestingly the background color (background-color:#9F1F63;) is being applied in IE6 but not the font color (color:#FFFFFF;) Any ideas on why this is happening and how I can fix it appreciated. The complete styling for the nav below: .side_nav { text-align : left; margin-left: -10px; } .side_nav ul { list-style-type: none; list-style-position:inside; margin-left:0px; } .side_nav li { margin-top: 10px; display: list-item; list-style-type:none; } .side_nav a, .side_nav a:visited { text-decoration: none; color : #9F1F63; font-weight : bold; padding: 5px 10px 5px 10px; } .side_nav a:hover { color:#B26D7F; } .side_nav a.active { color:#FFFFFF; background-color:#9F1F63; } EDIT: Thanks but the suggestions haven't helped. When I change to a:active the active effect does not work in any browser. I think this might be due to how I have applied the style in the HTML. <div class="side_nav"> <a class="active" href="Page1.aspx">Page1</a><br /> <a href="Page2.aspx">Page2</a><br /> <a href="Page3.aspx">Page3</a><br /> </div>

    Read the article

  • asp.net ajax collapsible panel in ie8 problem

    - by stuart
    Anyone try this simple bit of code in an ie8 browswer and try refreshing the page, in ie8 you will get an error around getelementbyid on refresh. When i run it it complains of not being able to find control with id of 'ctl00_main_dd' <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender2" runat="server" ImageControlID="Image2" CollapsedImage="~/App_Themes/IMStandard/icons/uparrow.png" ExpandedImage="~/App_Themes/IMStandard/icons/downarrow.png" CollapseControlID="dd" ExpandControlID="dd" TargetControlID="pnlQuickKeywordSearch" SuppressPostBack="true"> </cc1:CollapsiblePanelExtender> <asp:Panel ID="dd" runat="server"> <h3 class="loginHeader"> <asp:Image ID="Image2" runat="server" /> &nbsp;&nbsp;Quick Keyword search&nbsp;<asp:Image ID="HelpIconImage" runat="server" Width="16px" Height="16px" ImageUrl="~/App_Themes/IMStandard/icons/help.png" /></h3> </asp:Panel> <asp:Panel ID="pnlQuickKeywordSearch" Style="float: left; border: double 3px #C9DF86;" runat="server" > <div style="clear: both; padding: 5px;"> </div></asp:Panel> Anybody know why this is happening? is it a bug in ie8 or am i missing something? By the way, i am using masterpages, but i dont think that has anything to do with it. Thanks

    Read the article

  • Button Template does not render Image clearly.

    - by Akash Kava
    Here is my button template, <Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" RenderDefaulted="{TemplateBinding IsDefaulted}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Image Source="{TemplateBinding ImageSource}" RenderOptions.BitmapScalingMode="NearestNeighbor" SnapsToDevicePixels="True" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="None" /> <ContentPresenter Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" RecognizesAccessKey="True"/> </Grid> </Microsoft_Windows_Themes:ButtonChrome> Now you can see as per this question My Images are blurry on StackOverflow I tried .. RenderOptions.BitmapScalingMode="NearestNeighbor" On all levels, grid, chrome .. and tried various combinations of SnapsToDevicePixels but images just wont show up correctly. I set Stretch=None, image is aligned at center, still why it stretches automatically? here is the output and its very frustrating. Actual size of the image is 16x16 but I some how figured out by using Windows Maginifier that no matter what I do, the image is actually trying to render as 20x20, for the bigger images its even cropping the right most and bottom part. I think image should be rendered correctly 16x16 when Stretch=None, can anyone clarify whats problem here?

    Read the article

  • Optimizing a shared buffer in a producer/consumer multithreaded environment

    - by Etan
    I have some project where I have a single producer thread which writes events into a buffer, and an additional single consumer thread which takes events from the buffer. My goal is to optimize this thing for a single machine to achieve maximum throughput. Currently, I am using some simple lock-free ring buffer (lock-free is possible since I have only one consumer and one producer thread and therefore the pointers are only updated by a single thread). #define BUF_SIZE 32768 struct buf_t { volatile int writepos; volatile void * buffer[BUF_SIZE]; volatile int readpos;) }; void produce (buf_t *b, void * e) { int next = (b->writepos+1) % BUF_SIZE; while (b->readpos == next); // queue is full. wait b->buffer[b->writepos] = e; b->writepos = next; } void * consume (buf_t *b) { while (b->readpos == b->writepos); // nothing to consume. wait int next = (b->readpos+1) % BUF_SIZE; void * res = b->buffer[b->readpos]; b->readpos = next; return res; } buf_t *alloc () { buf_t *b = (buf_t *)malloc(sizeof(buf_t)); b->writepos = 0; b->readpos = 0; return b; } However, this implementation is not yet fast enough and should be optimized further. I've tried with different BUF_SIZE values and got some speed-up. Additionaly, I've moved writepos before the buffer and readpos after the buffer to ensure that both variables are on different cache lines which resulted also in some speed. What I need is a speedup of about 400 %. Do you have any ideas how I could achieve this using things like padding etc?

    Read the article

  • DocType xhtml1-transitional.dtd ignores table cell height

    - by Sameer Shariff
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> <link href="Stylesheet.css" rel="stylesheet" type="text/css" /> </head> <body> <table style="height: 100%; width: 100%;"> <tr> <td colspan="2" style="height: 100px;">Header</td> </tr> <tr> <td style="width: 180px;">Links</td> <td>Content</td> </tr> <tr> <td colspan="2" style="height: 25px;">Footer</td> </tr> </table> </body> </html> Stylesheet.css looks as follows: * { margin: 0; padding: 0; } html, body { height: 100%; width: 100%; } Row 1 and 3 above have fixed heights. Row 3 is not filling the remaining space. If i omit the doctype, it works as expected. I need to use this doctype. Please help! Thanks!

    Read the article

  • How to adjust font size with Cufon?

    - by user77413
    I am using a condensed font in Cufon. When the page loads, my menu is too wide and wraps. Then Cufon replaces the font and it looks fine. To reduce the visual distraction, I want to set the font size smaller and then have Cufon change the font size when it displays. Currently the font size is set by the div containing the menu. Here is the CSS for the menu container: .header_menu_block { display: block; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; margin-top: 3px; /*margin-left: 238px; ie 6 can't handle, see margin block below*/ float: left; text-align: left; font-weight: normal; font-size: 14px; color: #FFFFFF; height: 41px; width: 991px; } The Cufon replacement code looks like this: <script type="text/javascript"> Cufon.replace('.header_menu_block_col_menu ', { color: '#ffffff', hover: {color: '#204966'} } ); </script> I've tried setting the CSS font size to 12px and then using the following Cufon code, but it does not work: <script type="text/javascript"> Cufon.replace('.header_menu_block_col_menu ', { color: '#ffffff', hover: {color: '#204966'}, font-size:'14px' } ); </script> Does anyone know how to do this?

    Read the article

< Previous Page | 81 82 83 84 85 86 87 88 89 90 91 92  | Next Page >