|
CSS Resource - Base CSS File
06-17-2010, 09:36 AM
|
CSS Resource - Base CSS File
|
Posts: 255
Name: John Nerush
Location: Milton Keynes, UK
|
Ive been working on my base CSS file and think its about as refined as I am going to get it.
I am very interested in anyones comments, input, critics etc, so we can refine this further and have it for anyone to use.
I have split colours from the main styles for organisational reasons, this may or maynot appeal to some of you but that comes down to personal work flow.
Ive left some values in mainly for example. Obviously on launch you would optimise the file.
CSS File:
Code:
/* ------------------------------------------------------------------------------ Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{ margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
body { line-height:1; }
ol, ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption, th, td { text-align:left; font-weight:normal; }
blockquote:before, blockquote:after, q:before, q:after { content:""; }
blockquote, q { quotes:"" ""; }
/* ---------------------------------------------------------------------------- Tags */
body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:.8em; text-align:center; }
a,a:visited { text-decoration:none; }
a:hover,a:active,a:focus {}
h1,h2,h3 { font-family:Georgia, "Times New Roman", Times, serif; }
h1 { font-size:1.5em; margin:0 0 15px 0; }
h2 { font-size:1.2em; margin:0 0 5px 0; }
h3 { font-size:1.1em; margin:0 0 5px 0; }
p { margin:15px 0; }
strong { font-weight:bold; }
/* --------------------------------------------------------------------------- Structural ID's */
#secDiv,#mainDiv,#thirdDiv{ float:left; }
#wrapper,#footer { width:990px; }
#wrapper { margin:0 auto; text-align:left; }
#secDiv { width:264px; }
#mainDiv { width:430px; padding:0 12px 0 26px; }
#thirdDiv { width:258px; }
#footer { clear:both; margin:10px auto; font-size:.8em; text-align:center; }
#footer ul, #footer ul li {}
#footer ul {}
#footer ul li a {}
#footer p {}
/* --------------------------------------------------------------------------- Content ID's */
#nav {}
#nav li a {}
#nav li a:hover, #nav li a.sel {}
/* --------------------------------------------------------------------------- Classes */
.clear { clear:both; }
/* --------------------------------------------------------------------------- Misc */
/* --------------------------------------------------------------------------- Overrides */
/* --------------------------------------------------------------------------- Colours */
/* --------------- Font colour ----------- color:#fff; */
body,#nav li a { color:#000; }
a,h1,h2,h3,#nav li a:hover,#nav li a.sel { color:#ff0000; }
a:visited { color:#990000; }
a:hover,a:active,a:focus{ color:#ccc; }
/* --------------- Background colour ----- background-color:#fff; */
body { background-color:#fff; }
#nav { background-color:#ccc; }
/* --------------- Border colour --------- border-color:#fff; */
/* --------------- Misc colour ----------- ??? */
__________________
Please login or register to view this content. Registration is FREE
Learn professional skills from professional people, from $6.50 a month.
|
|
|
|
06-17-2010, 01:55 PM
|
Re: CSS Resource - Base CSS File
|
Posts: 10,017
Location: Tennessee
|
Why are you removing the underline from links??? That's just bad for accessibility. Remove the underline for specific navigation needs, but I wouldn't remove it on a global reset at all.
.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
|
|
|
|
06-18-2010, 03:57 AM
|
Re: CSS Resource - Base CSS File
|
Posts: 255
Name: John Nerush
Location: Milton Keynes, UK
|
I dont generally have links underlined in my designs, if anything then i do it on hover but still thats rare, i guess its personal preference.
__________________
Please login or register to view this content. Registration is FREE
Learn professional skills from professional people, from $6.50 a month.
|
|
|
|
06-18-2010, 09:30 AM
|
Re: CSS Resource - Base CSS File
|
Posts: 10,017
Location: Tennessee
|
You're in the UK and you're not meeting the accessibility requirements?
As designers, we often have to set our personal preferences aside - because ultimately the sites are not for US, they are for the public - including those with disabilities that might be using assistive technology. Relying on COLOR to indicate links is also not good because people who are colorblind may not see the color differences - hence it's best practice to leave the underline on links.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
Last edited by LadynRed; 06-18-2010 at 02:29 PM..
|
|
|
|
06-18-2010, 09:43 AM
|
Re: CSS Resource - Base CSS File
|
Posts: 255
Name: John Nerush
Location: Milton Keynes, UK
|
Mhmm, i see your point however,
The legal requirements are aimed at corporate sites, while all sites should conform to the requirements, providing the stylesheets can be disabled then you are safe from a legal standpoint.
It maybe best practice to leave underlines in etc, sometimes design has to come first, gaming sites, graphic portfolios etc.
With my last job, we did loads of work for local goverment agencys and councils, so obviously accessibility was one of the main focuses and thus you would expect the disability discrimination act to be followed to the letter and then some but do you think a Halo3 clan site reasonably needs to follow the same path?
The disability discrimination act is just another example of PC gone mad.
Here is a good article on the act:
http://www.designspring.co.uk/articl...nation-act.htm
__________________
Please login or register to view this content. Registration is FREE
Learn professional skills from professional people, from $6.50 a month.
|
|
|
|
|
« Reply to CSS Resource - Base CSS File
|
|
|
| Thread Tools |
Search this Thread |
|
|
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|