It seems that padding style applying to <td /> doesn't work on IE7 in my computer, but is okay on FireFox3.5.
Is this a correct behavior? Or I get wrong.
Thanks.
Hi,
i have this page:
login: [email protected]
password: m
I want to have the string "Editar mi perfil" aligned on the right, so i have added:
text-align: right
but it doesn't work,
I have tried also:
float:right
It works but goes a bit upper than I want.
Any idea?
Regards
Javi
I'm trying to style a table row using both cycle and a helper, like shown:
<tr class= <%= cycle("list-line-odd #{row_class(item)}", "list-line-even #{row_class(item)}")%> >
However, when I do this, the resulting HTML is:
<tr class = "list-line-odd" lowest-price>
with the return from the helper method not enclosed in the quotes, and therefore not recognized.
Here's the helper I'm using:
def row_class(item)
if item.highest_price > 0 and item.lowest_price > 0 and item.highest_price != item.lowest_price
if item.current_price >= item.highest_price
"highest-price"
elsif item.current_price <= item.lowest_price
"lowest-price"
end
end
end
I must be missing something obvious, but I just can't figure out how to wrap both the result of cycle and the helper method return in the same set of quotes. Any help would be greatly appreciated!
The Goal: Use votes to rank nominated sites. The first answer to reach 100+ votes will be accepted.
Please answer following these 5 simple rules:
ONE SITE per answer.
Link to each page if nominating a "series" of resources on a SITE.
No "offline" books. Only online resources (tutorials, API references, blogs, screencasts, etc).
Don't add "subjective" details/notes in your answer. Add them as a comment to the answer.
Don't post duplicates. If your favourite is already listed Up Vote It!
Example Answer:
Site Name
http://www.example.com
Example Answer (site with a series of resources):
Site Name
http://www.example.com
Series Name A
http://www.example.com/video/a/1
http://www.example.com/video/a/2
Series Name B
http://www.example.com/video/b/1
I hope i described the problem well!? You can see it here:
http://dealmob.de/index_dev.html
when u hover over the menu up and down fast u see the that its not staying, insteads its flickering like you would change the margins/paddings by few pixels.
Any advice on how to solve this problem?
thanks a lot
like requested:
#topcities {
float:right;
}
#topcities li {
padding-left:5px;
width:100px;
}
#topcities li:hover {
cursor:pointer;
color:#000;
background: url(images/hover_menue_back.jpg) repeat-x #FFF;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border:grey 1px solid;
width:100px;
}
I have 5 list items that act like tabs for a page stored in a Masterpage in a asp.net application. When the user selects a list item, I would like to redirect the the page, and change the class for that list item (tab) to show the active tab the user is on. What is the best way to dynamically change the class of the list item based on the user interaction with them, and maintain the state?
Hello,
I wonder why does this style not work in IE and FF, but in Chrome ONLY
#show{top:10%; position:relative; margin: 0px auto; width:100%;}
[Edit]
If I want to make the same work in IE and FF, what do I have to do
Thanks
Jean
Is it possible to have a navigation system optimized using javascript, but for the sake of search engines, have the hyperlinks still be crawlable?
Or maybe a condition statement that calls HTML code only if javascript is not enabled in the browser or when crawled by a search engine?
I have used this effect before, everything is in order (As far as I see), but it's just not working. What have I missed?
Fiddle here
Sprite here
Thanks.
I'm following this tutorial for a project at work, and I was wondering if there is a way to create several lines on the same graph? At the moment I can;t do this without moving the other line along.
I'm using MooTools 1.4.5 and I want to change cursor before calling function that takes some time and after finished same function set cursor to default. I was not successful.
After that I made simple example to change background color via plain JavaScript (no jQuery or MooTools plugin) and again I was not successful.
Here is my code.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
<script type="text/javascript">
<!--
document.body.style.background = 'red';
setTimeout(function () { }, 1250);
document.body.style.background = 'yellow';
//-->
</script>
</html>
First at all I set background color to red, and after delay to yellow. I assumed that the background color will bi set to red and after delay to yellow. It doesn't work. When page is loaded background color is yellow (last line). If I insert alert function in a middle of lines where sets background color everything works fine (background color is red, click to message box, background color is yellow).
Why it works so? Only last changing style is affected. I need something like that to change pointer before calling function that takes 10 seconds and setting cursor to default value after function is done.
hi,
I don't understand why I have this blue border around the links images in my page.
I've set outline:none border:0 but still it is there (only in Firefox and IE)... it is very strange.
http://www.alimdardesign.com/fabulicious/features.html
Thanks
I have the following div being rendered to the client, but on IE, the checked-yes class is ignored. If I view the target element in the 'Developer Tools', that class is completely missing from the Style panel. The shift-item-present class is attached server side, and the checked-yes class client side, depending on the present attribute of the parent row, also shown below.
<td><div class="shift-item-present checked-yes" jQuery1272958392665="94"/></td>
Parent row:
<tr class="shift-item" id="ctl00_mainContentPlaceHolder_ctl00_shiftList_ctl01_shiftRow" present="True" shift-id="641" jQuery1272958392665="64">
The page works perfectly in FF
Hello,
I want to place this div at the bottom of the screen, and should stay at the bottom even though there is a scroll, it stays at the bottom, but moves when I scroll.
<div style="color:#FFF; position:absolute; bottom:0px;">
<?php
$time_taken=round(getmicrotime()-$time_start,4);
echo"Generated in ".$time_taken." seconds";
?>
</div>
Thanks
Jean
I'm about to develop my own browser inconsistency/bug compendium site but I'm wondering if I really need to - can we get a wiki of sites that do this already? I'm aware of a lot of them but I hope I'm not missing out on some major ones.
I wanted mine to be more intuitive and social-like for most people, powered by tags and screenshots and test-case pages.
I'm building a navigation system using jquery scrollto. I have my navigation menu in a separate file (( navigation.php )). It is included in 5 locations on the first page (( 5 different sections w/ text following each )). I'm trying to figure out a way to have the current "tab" highlight'd. I could hard code the navigation in each location to ensure it shows up the correct way, but I'd rather use the phpinclude() method. The other issue is that each "tab" has it's own unique color (( cmykd )). Here is the alpha version of what I'm doing (( when you click && the page slides, the "active tab" still stays grey -- I'd like it to be the corresponding color )).
Hope this all makes sense && thanks in advance !!
I'm trying to find a good way to collect the names of classes defined in the stylesheets included with a given document. I know about document.StyleSheetList but it doesn't seem like it'd be easy to parse. What I'm looking for is something like, for a stylesheet document such as:
.my_class {
background: #fff000;
}
.second_class {
color: #000000;
}
I could extract an array like ["my_class", "second_class"]. This obviously assumes the favorable scenario of a fully loaded dom and stylesheets.
I've been looking everywhere for a good way to do something like this and so far, have made little progress. Does anyone have any idea about how to pull this off? Thanks!
why does the border get like this, i want it around the videoclip, if i use float it do the border correctly, if i use position, then it gets like that, and i dont want to use float.
#clip{
position: relative; right: 1px; border: 2px solid #FF3399;
}
I am trying to centre the link with the image, but can't seem to move the content vertically in any way.
<h4>More Information</h4>
<a href="#" class="pdf">File Name</a>
The icon is 22 x 22px
.pdf{ }
.pdf:before{padding:0 5px 0 0; content: url(../img/icon/pdf_small.png);}
.pdf:after{content: " ( .pdf )"; font-size: 10px;}
.pdf:hover:after{color: #000;}
I have created a navigation menu which has a 'sliding underline' effect for each hyperlink.
JS Fiddle: http://jsfiddle.net/ZZuQR/12/
RELEVANT CODE:
/* sliding underline */
nav li a:after {
content: " ";
display:block;
margin: 5px 0px 0px 0px;
border-bottom: 3px solid transparent;
width: 0px;
transition: 0.5s ease;
}
nav li a:hover:after {
border-bottom: 3px solid #0076a3;
width:50px;
}
This solution works in Chrome but not in Safari. Does anyone know why this might be?
I've written a jQuery script to replace <select /> elements with some DIV's and UL's allowing my to simulate the original SELECT but also allow me to style it. So far, aside from a few minor bugs, it works rather nicely.
However, in Internet Explorer, the 'options' div is getting rendered underneath the elements below the div.
Here's the HTML:
<div class="styledSelect-parent" style="display: inline-block; width: 59px;">
<div class="styledSelect-newSelect" style="position: relative;">
<input class="styledSelect-newSelect-selector" style="width: 59px;" readonly="readonly" name="hello" value="Test1" type="text">
<div class="styledSelect-newSelect-options" style="display: none; z-index: 20; width: 59px; position: absolute; left: 0px; top: 18px;">
<ul>
<li>Test1</li>
<li>Test2</li>
<li>Test3</li>
<li class="styledSelect-active">Test4</li>
<li>Test1</li>
<li>Test2</li>
</ul>
</div>
</div>
</div>
<br /><br />
<div class="styledSelect-parent" style="display: inline-block; width: 59px;">
<div class="styledSelect-newSelect" style="position: relative;">
<input class="styledSelect-newSelect-selector" style="width: 59px;" readonly="readonly" name="hello" value="Test1" type="text">
<div class="styledSelect-newSelect-options" style="display: none; z-index: 20; width: 59px; position: absolute; left: 0px; top: 18px;">
<ul>
<li class="styledSelect-active">Test1</li>
<li>Test2</li>
<li>Test3</li>
</ul>
</div>
</div>
</div>
If I open the first select, the LI list sits underneath the second select box rather than above it. I can't get the z-indexes to work properly.
What am I missing? :/
like this
in my design both side of div has border like this and content in div can be increased or decreased . and in any condition both side top and bottom should be blur like this.
How to make this possible
I've trying to do something that I'm sure is simple, but I can't do it.
All I want to do is have an image and then some text after that image, and be able to control accurately the amount of space between the image and the text.
Here's my code:
http://pastebin.com/fx17XUaR
I couldn't work out how to paste it in here directly.
In my style sheet, wrap has these attributes:
.wrap {
//text-align: left;
width: 1100px;
height: 870px;
background-color: white;
color: black;
padding: 10px;
margin: auto;
I want my text to look like this directly below the image:
Username
Age
Location
Currently, I just add loads of break tags to control where I have the text, but that's messy and there must be a better way.
Thanks in advance for any help.