[thelist] accessing an input type (ie checkbox) through a nested CSS style

Maximillian Schwanekamp lists at neptunewebworks.com
Wed Sep 7 18:09:51 CDT 2005


Roger Newbrook wrote:
> I am trying to style a series of forms using CSS. I have access to the
> stylesheet to do this but not the actual codebase to add necessary
> additional classes etc.

Bummer.  But if the markup being output to the browser is reasonably 
clean, you should be able to go fairly far with pure css.

> I want to redefine my text boxes with a different than default border.
> Initially I achieved this through redefining the input tag. A side effect of
> this is, that in redefing the input tag I am inheriting the redefined border
> on checkboxes and radio buttons.

Child selectors are your friend.  Usually text inputs, selects, etc are 
inside some kind of containing element, such as label, fieldset, or in 
old-school pages usually a table.  Often submit and other buttons are 
outside that container, so you can do something like this to apply the 
style only to inputs within the container:
fieldset input,
td input {
   border: 5px dashed orange;
}

> 
> input.text or input[type="text"] as ways of accessing the input type.

input.text requires putting class="text" on all regular text input 
elements.  The other is IIRC CSS 2.0, which is not well supported by 
Internet Explorer pre v7.

-- 
Max Schwanekamp http://www.neptunewebworks.com/



More information about the thelist mailing list