Best Way to Convert PSD to CSS/HTML File?
I'm working to convert a Photoshop PSD to a HTML/CSS web layout. I know there are some tricks to doing this quickly, I just don't know what they are. The question is, do you? ...
css
Is there a list of browser conditionals for use including stylesheets?
I've seen people doing things like this in their HTML: <!--[if IE]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]--> Does this work across all modern browsers and is there a list of browser types that will work with that kind of if statement? Edit Thanks Ross. Interesting to find out about gt, lt, gte, & lte. ...
why are all links in my site are red, in google chrome and safari?
just started using google chrome, and noticed in parts of our site, all the links on the page are bright red. They should be black with a dotted underline. Is there some gotcha in webkit rendering that turns all links red regardless of style? ...
HTML: center a block of content when you don't know in advance its width.
After lots of attempts and search I have never found a satisfactory way to do it with CSS2. A simple way to accomplish it is to wrap it into a handy TABLE as shown in the sample below. Do you know how to do it avoiding table layouts and also avoiding quirky tricks? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <...
Javascript and CSS parsing performance
I am trying to improve the performance of a web application. I have metrics that I can use to optimise the time taken to return the main HTML page, but I'm concerned about the external CSS and Javascript files that are included from these HTML pages. These are served statically, with HTTP Expires headers, but are shared between all the...
Is there a Firefox 3 addon similar to View Source Chart?
Before I upgraded to Firefox 3 I used to constantly use the View Source Chart Firefox Addon which shows the source HTML in a very organized, graphical form. Unfortunately, this addon is only for Firefox 2 and the beta version for Firefox 3 now costs $10 on the author's site. Anyone know of a similar addon that works for Firefox 3? (of...
Child spans of the same width
I am trying to create a horizontal menu with the elements represented by <span>s. The menu itself (parent <div>) has a fixed width, but the elements number is always different. I would like to have child spans of the same width, independently of how many of them are there. What I've done so far: added a "float: left;" style for every s...
A Well-Designed Web App GUI Framework?
As one of those people that never got around to properly learning design (or having no talent for it), the design seems to be the step always holding me back. It's not a problem for rich-clients, as the standard GUI toolkits provide some acceptable ways to design a good-looking interface, but the web is another story. Question: Does an...
Create a variable in .CSS file for use within that .CSS file
We have some "theme colors" that are reused in our CSS sheet. Is there a way to set a variable and then reuse it? E.g., .css OurColor: Blue { H1 color:OurColor; } ...
How to make your website look the same on Linux
I have a fairly standards compliant XHTML+CSS site that looks great on all browsers on PC and Mac. The other day I saw it on FF3 on Linux and the letter spacing was slightly larger, throwing everything out of whack and causing unwanted wrapping and clipping of text. The CSS in question has font-size: 11px; font-family: Arial, Helvetica,...
Most elegant way to force a TEXTAREA element to line-wrap, *regardless* of whitespace
Html Textarea elements only wrap when they reach a space or tab character. This is fine, until the user types a looooooooooooooooooooooong enough word. I'm looking for a way to strictly enforce line breaks (eg.: even if it results in "loooooooooooo \n ooooooooooong"). The best I've found is to add a zero-width unicode space after ever...
How do I position one image on top of another in HTML?
I'm a beginning rails programmer, attempting to show many images on a page. Some images are to lay on top of others. To make it simple, say I want a blue square, with a red square in the upper right corner of the blue square (but not tight in the corner). I am trying to avoid compositing (with ImageMagick and similar) due to perfomanc...
How to prevent a hyperlink from linking.
Is it possible to prevent an asp.net Hyperlink control from linking, i.e. so that it appears as a label, without actually having to replace the control with a label? Maybe using CSS or setting an attribute? I know that marking it as disabled works but then it gets displayed differently (greyed out). To clarify my point, I have a list o...
Practical solution to center vertically and horizontally in HTML that works in FF, IE6 and IE7
What can be a practical solution to center vertically and horizontally content in HTML that works in Firefox, IE6 and IE7? Some details: I am looking for solution for the entire page. You need to specify only width of the element to be centered. Height of the element is not known in design time. When minimizing window, scrolling shoul...
CSS2 Attribute Selectors with Regex
CSS Attribute selectors allow the selection of elements based on attribute values. Unfortunately, I've not used them in years (mainly because they're not supported by all modern browsers). However, I remember distinctly that I was able to use them to adorn all external links with an icon, by using a code similar to the following: a[href...
How do I *really* justify a horizontal menu in HTML+CSS?
You find plenty of tutorials on menu bars in HTML, but for this specific (though IMHO generic) case, I haven't found any decent solution: # THE MENU ITEMS SHOULD BE JUSTIFIED JUST AS PLAIN TEXT WOULD BE # # ^ ^ # There's an varying number...
Sources of inspiration for navigation breadcrumbs
I'm looking for sources of inspiration and/or design patterns for navigation 'breadcrumbs'. So far I have found the breadcrumb collection on Pattern Tap. Does anyone know of any other sources? ...
how to remove black border around hyperlinked image?
When I turn an image () into a hyperlink (by wrapping it in ), Firefox adds a black border around the image. Safari does not display the same border. What CSS directive would be best to eliminate the border? ...
Does "display: marker" work in any current browsers, and if so, how?
I can't be sure if my code is sucking, or if it's just that the browsers haven't caught up with the spec yet. My goal is to simulate list markers using generated content, so as to get e.g. continuation of the counters from list to list in pure CSS. So the HTML is like this: <ol> <li>The<li> <li>quick</li> <li>brown</li> </ol> <ol> ...
Floats messing up in Safari browsers
I have a site I made real fast that uses floats to display different sections of content. The floated content and the content that has an additional margin both appear fine in FF/IE but on safari one of the divs is completely hidden. I've tried switching to padding and position:relative but nothing has worked for me. If I take out the co...