css

Abstraction away from CSS

Let me make something quite clear. I. Hate. CSS. It is a never-ending nightmare. Every minor layout change feels like a hack. Solutions to problems seem to often involve jiggering numbers around like some chef trying to work out exactly how much nutmeg to put in his soon-to-be famous rice pudding. Then comes the multiple browser issue,...

What is your best tool or techniques for getting the same display on IE6/7 and Firefox?

I'm not talking about tools that let one view a page in combinations of operating systems and browsers like crossbrowsertesting.com but in creating or figuring out the actual CSS. ...

should websites expand on window resize?

I'm asking this question purely from a usability standpoint: Should a website expand/stretch to fill the viewing area when you resize a browser window? I know for sure there are the obvious cons: Wide columns of text are hard to read Writing html/css using percents can be a pain It makes you vulnerable to having your design stretched ...

Is there a library for rendering basic flow diagrams in Javascript/CSS?

On a web page I want to dynamically render very basic flow diagrams, i.e. a few boxes joined by lines. Ideally the user could then click on one of these boxes (DIVs?) and be taken to a different page. Resorting to Flash seems like an overkill. Is anyone aware of any client-side (i.e. server agnostic) Javascript or CSS library/technique t...

Is there a simple way to make html textarea and input type text equally wide?

Is there a simple way of getting a HTML textarea and an input type="text" to render with (approximately) equal width (in pixels), that works in different browsers? A CSS/HTML solution would be brilliant. I would prefer not to have to use Javascript. Thanks /Erik ...

HTML Select Tag with black background - dropdown triangle is invisible in Firefox 3

I have the following HTML (note the CSS making the background black and text white) <html> <select id="opts" style="background-color: black; color: white;"> <option>first</option> <option>second</option> </select> </html> Safari is smart enough to make the small triangle that appears to the right of the text the same colo...

Avoiding repeated constants in CSS

Are there any useful techniques for reducing the repetition of constants in a CSS file? (For example, a bunch of different selectors which should all apply the same colour, or the same font size)? ...

Fixed page layout in IE6

Header, footer and sidebars have fixed position. In the center a content area with both scroll bars. No outer scroll bars on the browser. I have a layout that works in IE7 and FF. I need to add IE6 support. How can I make this work? Here is an approximation of my current CSS. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//...

Enforcing web standards

The HTML standard defines a clear separation of concerns between CSS (presentation) and HTML (semantics or structure). Does anyone use a coding standards document for CSS and XHTML that has clauses which help to maintain this separation? What would be good clauses to include in such a coding standards document? ...

How to remember in CSS that margin is outside the border, and padding inside

I don't edit CSS very often, and almost every time I need to go and google the CSS box model to check whether padding is inside the border and margin outside, or vice versa. (Just checked again and padding is inside). Does anyone have a good way of remembering this? A little mnemonic, a good explanation as to why the names are that wa...

Browser's Default CSS

Are there any lists of browser CSS defaults? (browser stylsheets in tabular form) I want to know the default font of textareas across all browsers and also for future reference. ...

Setting the height of a DIV dynamically

In a web application I'm working on, I have a page that contains a DIV that has an auto-width depending on the width of the browser window. However, I need to be able to have an auto-height for the object. The DIV starts about 300px from the top screen, and it's height should make it stretch to the bottom of the browser screen. I have...

Is elegant, semantic CSS with ASP.Net still a pipe dream?

I know Microsoft has made efforts in the direction of semantic and cross-browser compliant XHTML and CSS, but it still seems like a PitA to pull off elegant markup. I've downloaded and tweaked the CSS Friendly Adapters and all that. But I still find myself frustrated with bloated and unattractive code. Is elegant, semantic CSS with ASP....

How can I find unused images and CSS styles in a website?

Is there a tool or methodology (other than trial and error) I can use to find unused image files? How about CSS declarations for ID's and Classes that don't even exist in the site? It seems like there might be a way to just spider the site, profile it, and see which images and styles are never loaded. ...

IE CSS Bug - How do I maintain a position:absolute when dynamic javascript content on the page changes

Hi, I have a page where there is a column and a content div, somewhat like this: <div id="container"> <div id="content">blahblahblah</div> <div id="column"> </div> </div> With some styling I have an image that is split between the column and the content but needs to maintain the same vertical positioning so that it lines up. ...

Determining width of a printed string by a webapp

In my (PHP) webapp, I have a part of my site that keeps a history of recent searches. The most recent queries get shown in a side box. If the query text is too long, I truncate it and show ellipses. Eg: "My very long query is..." Currently, I truncate after a certain number of characters. Since the font is not monotype, a query of all I...

textarea with 100% width ignores parent element's width in IE7

I have the following textarea in a table: <table width="300"><tr><td> <textarea style="width:100%"> longstringlongstringlongstringlongstringlongstringlongstringlongstringlongstringlongstringlongstringlongstringlongstringlongstring </textarea> </td></tr></table> With a long string in the textarea, the textarea stretches out to accomm...

How to make user controls know about css classes in ASP.NET

Since there are no header sections for user controls in asp.net, user controls have no way of knowing about stylesheet files. So css classes in the user controls are not recognized by visual studio and produces warnings. How can I make a user control know that it will relate to a css class, so if it is warning me about a non-existing css...

Show unordered list inline, but keep the bullets

I have an html file with an unordered list. I want to show the list items horizontally but still keep the bullets. No matter what I try, whenever I set the style to inline to meet the horizontal requirement I can't get the bullets to display. ...

How do you swap DIVs on mouseover? (jquery?)

This most be the second most simple rollover effect, still I don't find any simple solution. Wanted: I have a list of items and a correspoding list of slides (DIVs). After loading, the first list item should be selected (bold) and the first slide should be visible. When the user hovers over another list item, that list item should be se...