Hi people,
I am working on a website curently. Here is the link for it.
Good News : The site is fine on FireFox, Chrome and IE 8.
Bad News: It is not fine on IE 7. Alignment problems, hyperlink colour problems, etc.
What should i do to make things normal on IE7 too.
Any amount of help would be appreciated.
Thanks
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!
In Word you can place an image on a page and have the text flow nicely around it. I was wondering how far one can get towards this using CSS, noting that is has to work in IE6.
I already have something sort of close using float, but the floated child-element still 'blocks' text above it. So it partially wraps. Is it possible to put a child div at some arbitrary position in the parent, and have text flow around it freely?
The actual use-case here is to put illustrations inside the main content , where each illustration is implemented inside a child .
I repeat, it has to work on IE6. And I don't want to get too involved in browser-specific hacks... floating the child at least works on IE6 with no tweaking.
Currently I have like this:
<div>
<div class="illustration">
<img src="image1.png" />
<p>Illustration caption</p>
</div>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. Atvero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
</div>
div.illustration
{
float:right;
border-top: 1px solid #505050;
border-left: 1px solid #505050;
border-right: 1px solid #505050;
border-bottom: 1px solid #505050;
margin-right:30px;
margin-top:100px;
text-align:center;
padding:2px;
background: #96C3FF;
}
div.illustration p
{
margin:0;
font-size:small;
font-style:italic;
padding:0;
}
Hi,
I have just finished redesigning this site (www.imustsolutions.co.za) and I have a problem with the header and the footer when the user zooms in (Cntrl + in FF).
Here is the problem:
The background color of the footer/header does not paint to fill the rest of the screen (horizontally) when the user zooms in.
What am I doing wrong?
Here is the site again: www.imustsolutions.co.za
Thanks in advance.
Regards,
M
I've been developing a web app for a few weeks now and ended up with about a 1000 lines. I am sure not all the selectors are being used and am trying to clean it up. At the same time, I don't want to do it manually for obvious reasons.
Is there a safe and an efficient way to remove unused selectors? For this, am I supposed to navigate the entire website to let it know which selectors are not being used? (I use javascript to add some selectors so these might not show up until a particular usecase is seen)
I am building a twitter application and would like to use the structure of the their homepage. Can anyone suggest how to go about doing this, or point to a reference that does this?
I do not intend to use any images that would be considered copyright, I just want to use the single column layout, with the side panel, header, footer.
Thanks!
hi,
I'm getting crazy with some browsers fixes to do everytime I'm doing a new website. For example, lately I've built my own Flash Video Player and I lost hours to fix some problems such as aligning it in IE and Firefox and Safari.
Would be so cool to have a intermediary layer, I could use to design my website, without taking care of all browsers fixes...
I guess I'm a dreamer
Hi to everybody.
I need to do a border for my website that looks like this one. The only way I know is to split the website with 9 div, such :
1 2 3
4 5 6
7 8 9
and create 8 images, respectively:
top-left (on 1)
top central (on 2)
top-right (on 3)
left (on 4)
right (on 6)
bottom-left (on 7)
bottom-center (on 8)
bottom-right (on 9)
The div 5 is attempt as main. But the whole strategy looks not so well-formed. Any tips? Thanks
I'm building a Drupal theme up and want to know if there is a Drupalish way to add a css file only if the user has js turned off.
This would ideally go in the theme.info file to keep it neat!
Something like this would be ideal:
conditional-stylesheets[if no javascript][all][] = nojs.css
If this isn't possible then I'm going to keep all the css that needs JS out of the css files, and add it dynamically using JS but this seems a bit messy...
Any ideas?
I have no code to start with.
I want to add 2 divs overlapping on each other and then use the new CSS3 Rotate function. The effect I want to create is shown on this page
Requirements
I don't want to use images
I don't mind using CSS3
It should be easy to align the whole thing in the center (which makes it harder to use position: absolute;).
It's going to be content below the boxed content (which makes it harder to use position: absolute;).
If it's possible without too much position: absolute; it's better.
I prefer table free solutions.
Have fun!
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.
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.
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
Hi! ASP.Net has a tag called CheckboxList. The output of this tag looks like this:
<table class="checkbox">
<tbody>
<tr>
<td>
<input id="/*longdynamicstring1*/" type="checkbox" name="/*longdynamicstring2*/" />
<label for="/*longdynamicstring1*/">Label Text</label>
</td>
</tr>
</tbody>
</table>
I want to position the label and the input but I cannot find out how. Tried the following:
.checkbox input{
padding-right: 5px;
}
and
.checkbox input[type='checkbox']
{
padding-right: 5px;
}
but neither of them had any effect. Because it's ASP I cannot set a class for the input elements and I cannot reference the id because it's dynamic.
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
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 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'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'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.
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 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?
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 !!