css

How can I display just a portion of an image in HTML/CSS?

Let's say I want a way to display just the the center 50x50px of an image that's 250x250px in HTML. How can I do that. Also, is there a way to do this for css:url() references? I'm aware of clip in CSS, but that seems to only work when used with absolute positioning. ...

jQuery: Remove all classes that begin with a certain string

I have a div with id="a" that may have any number of classes attached to it, from several groups. Each group has a specific prefix. In the javascript, I don't know which class from the group is on the div. I want to be able to clear all classes with a given prefix and then add a new one. If I want to remove all of the classes that begin ...

How to vertically center content with variable height within a div?

What is the best way to vertically center the content of a div when the height of the content is variable. In my particular case, the height of the container div is fixed, but it would be great if there were a solution that would work in cases where the container has a variable height as well. Also, I would love a solution with no, or v...

I have a link icon next to each link. How do I exclude the link icon from images?

I've got the following in my .css file creating a little image next to each link on my site: div.post .text a[href^="http:"] { background: url(../../pics/remote.gif) right top no-repeat; padding-right: 10px; white-space: nowrap; } How do I modify this snippet (or add something new) to exclude the link icon next to images t...

Can I change the appearance of an html image during hover without a second image?

Is there a way to change the appearance of an icon (ie. contrast / luminosity) when I hover the cursor, without requiring a second image file (or without requiring a hidden portion of the image)? ...

What are the CSS secrets to a flexible/fluid HTML form?

The below HTML/CSS/Javascript(JQuery) code displays the #makes select box. Selecting an option displays the #models select box with relevant options. The #makes select box sits off center and the #models select box fills the empty space when it is displayed. How do you style the form so that the #makes select box is centered when it is...

When did browsers start supporting multiple classes per tag?

You can use more than one css class in an HTML tag in current web browsers, e.g.: <div class="style1 style2 style3">foo bar</div> This hasn't always worked; with which versions did the major browsers begin correctly supporting this feature? ...

What is the best way to position a div in css?

I'm trying to place this menu: <div class="left-menu" style="left: 123px; top: 355px"> <ul> <li> Categories </li> <li> Weapons </li> <li> Armor </li> <li> Manuals </li> <li> Sustenance </li> <li> Test </li> </ul> </div> on the left hand side of the page. The ...

DIV's vs. Tables or CSS vs. Being Stupid

I know that tables are for tabular data, but it's so tempting to use them for layout. I can handle DIV's to get a three column layout, but when you got 4 nested DIV's, it get tricky. Is there a tutorial/reference out there to persuade me to use DIV's for layout? I want to use DIV's, but I refuse to spend an hour to position my DIV/SPA...

Using CSS how best to display name value pairs?

Should I still be using tables anyway? The table code I'd be replacing is: <table> <tr> <td>Name</td><td>Value</td> </tr> ... </table> From what I've been reading I should have something like <label class="name">Name</label><label class="value">Value</value><br /> ... Ideas and links to online samples greatly a...

Which text editor has the most useful autocomplete for web page editing?

Which text editor has the most useful autocomplete for text editing? That is, when you type a tag like <p>, the editor will automatically add </p> and put the cursor after the first tag. It should also display a context sensitive list of valid tags when you press CTRL+Space (or similar hotkey) I've been using Notepad++. I avoid Visual ...

Are liquid layouts still relevant?

Now that most of the major browsers support full page zoom (at present, the only notable exception being Google Chrome), are liquid or elastic layouts no longer needed? Is the relative pain of building liquid/elastic layouts worth the effort? Are there any situations where a liquid layout would still be of benefit? Is full page zoom the ...

Whats a liquid layout?

My designer keeps throwing out the term "liquid" layout. What does this mean? Thanks for the clarification, I have always just called this a percentage layout, and thought he was saying that the pieces could be moved around, and that was liquid ...

Alternative Style(CSS) methods in SAP Portal?

I am overriding a lot of SAP's Portal functionality in my current project. I have to create a custom fixed width framework, custom iView trays, custom KM API functionality, and more. With all of these custom parts, I will not be using a lot of the style functionality implemented by SAP's Theme editor. What I would like to do is create...

What is the single best javascript lightbox script currently available?

What is the best javascript lightbox script currently available? I'm working on a project and am a bit baffled at the number of lightbox scripts out there. The one I need should: not allow flash movies to show through the grayed out background work in all browsers including IE6, Opera should allow html content, flash files easily ski...

How can I fix an issue in IE where borders don't show up when the mouse isn't hovered over an image.

I am trying to create a rather simple effect on a set of images. When an image doesn't have the mouse over it, I'd like it to have a simple, gray border. When it does have an image over it, I'd like it to have a different, "selected", border. The following CSS works great in Firefox: .myImage a img { border: 1px solid grey; p...

What is the best online javascript/css/html/xhtml/dom reference?

I'm a front-end developer and I was looking for opinions about the best all-round online documentation for javascript/css/html/xhtml/dom/browser quirks and support. I've tried Sitepoint, Quirksmode, W3Schools but all of these seem to be lacking in certain aspects and have been using them in combination. ...

Ajax Control Toolkit Calendar Control CSS

I am using the AJAX Control Toolkit Popup Calendar Control in a datagrid. When it is in the footer it looks fine. When it is in the edit side of the datagrid it is inheriting the style from the datagrid and looks completely different (i.e. too big). Is there a way to alter the CSS so that it does not inherit the style from the datagrid...

How do you vertically center a custom image in a <li> element across browsers?

The design for the website I am working on calls for a custom image on lists instead of a bullet. Using the image is fine, but I have been having difficulties ensuring that it is centered against the text of the list item across all browsers. Does anyone know of a standard solution for this? ...

How can I use a traditional HTML id attribute with an ASP.net runat='server' tag?

I am refactoring some CSS on a website I have been working on, and noticed the absence of traditional HTML IDs in the code. There is heavy use of CssClass='', or sometimes just class='', but I can't seem to find a way to say id='' and not have it swapped out by the server. Here is an example: <span id='position_title' runat='server'>Ma...