Zymic Webmaster Forums > Clean Up My Code?

Zymic Webmaster Forums > Web Design & Development > Client Side Scripting > HTML and CSS

Drake14

Jan 6 2008, 11:18 PM

Can someone help me clean up my CSS code please?

CODE

body {

font-family: Tahoma;

font-size: 12px;

color: #000000;

background-color: #8d8989;

}

li {

list-style-type: circle;

line-height: 100%;

list-style-image:;

}

h1 {

font-family: Tahoma;

font-size: 32px;

font-weight: bold;

color: #000000;

}

h2 {

font-family: Tahoma;

font-size: 18px;

font-weight: bold;

color: #000000;

}

a:link {

color: #000000;

text-decoration: none;

font-weight: bold;

}

li :link {

color: #000000;

text-decoration: underline;

font-weight: bold;

}

a:visited {

color: #000000;

text-decoration: none;

font-weight: bold;

}

li a:visited {

color: #000000;

text-decoration: none;

font-weight: bold;

}

a:hover {

color: #CD0000;

padding-bottom: 5px;

font-weight: bold;

text-decoration: none;

}

li a:hover {

display: block;

color: #CD0000;

padding-bottom: 5px;

font-weight: bold;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: 000000;

}

a:active {

color: #000000;

font-weight: bold;

}

Drake14

Jan 6 2008, 11:42 PM

um...i was asking for some help. i wasn't asking for someone to do it for me....

i didn't want someone to re-code it. Just give me some tips on what could be changed....

jesus.....

LimitedEdition

Jan 7 2008, 07:49 AM

You could try putting rules in long hand.

So from this

CODE

border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: 000000;

to this

CODE

border-bottom: 1px solid #000000;

DerekC

Mar 15 2008, 06:18 AM

Don't know if anyone helped or not yet but here's my best I could come up with

CODE

body
{
    font: 12px tahoma;
    color: #000000;
    background-color: #8d8989;

}

li
{
    list-style-type: circle;
    line-height: 100%;
}

h1
{
    font: bold 32px tahoma;
    color: #000000;
}

h2
{
    font: bold 18px tahoma;
    color: #000000;
}

a:link,
a:visited,
li:link,
li a:visted
{
    color: #000000;
    text-decoration: underline;
    font-weight: bold;
}

a:hover
{
    color: #CD0000;
    padding: 0 0 5px 0;
    font-weight: bold;
    text-decoration: none;
}

a:active
{
    color: #000000;
    font-weight: bold;
}

li a:hover
{
    display: block;
    color: #CD0000;
    padding: 0 0 5px 0;
    font-weight: bold;
    border: 1px solid #000;
}

MrTouz

Mar 17 2008, 08:24 PM

Might not be clean up but a bit better :

CODE

a:link,
a:visited,
li:link,
li a:visted
{
    color: #000000;
    text-decoration: underline;
    font-weight: bold;
}

make a difference between links, hover, visited ?

CODE

a:link {
    color: #000000;
    text-decoration: none;
    font-weight: bold;
}
a:hover {
    color: #a1a1a1;
    text-decoration: underline;
    font-weight: bold;
}
a:visited {
    color: #666666;
    text-decoration: underline;
    font-weight: bold;
}

dunno just an example

nashultz07

Apr 13 2008, 07:58 AM

I would have to agree with most of these suggestions.

Here are some future tips to consider when coding your next CSS file:

If items are using the exact same formatting just separate them with commas and use one formatting area for it.

i.e.:

CODE

a:link, a:visited, li:link, li a:visted
{
    color: #000000;
    text-decoration: underline;
    font-weight: bold;
}

and if (of the above) you are just wanting one to have the text decoration, just omit it in the first section and add another section with just the one you are wanting to add the decoration to:

i.e.:

CODE

a:link, a:visited, li:link, li a:visited
{
color: #000000;
font-weight: bold;
}

a:link
{
text-decoration: underline;
}

Hope this helps!

Thanks,
Nathon

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.