Är denna CSS-struktur något att utgå ifrån?

Hej!

Jag tänkte göra ett riktigt ärligt försök att sätta mig in i hur CSS fungerar och jag har nu läst på lite i tipstråden här i forumet. Blev inspirerad igår när jag läste denna tråd och såg ur fint man kan få det om man gör det "by the book"!

Jag kan nog det jag behöver för att göra de formateringar jag vill. Det jag är dålig på är att "ge fan" i s.k. inlines direkt i html-koden istället för att skriva in det i css-filen :r Anledningen varför det blir så är nog två, dels för att jag inte tagit mig tiden att komma på en bra struktur i css-filen (upplever alltid att det lätt blir rörigt och att jag ibland definierar saker och ting dubbelt när man kan låta element ärva egenskaper) samt lära mig hur olika element ärver egenskaper från nivån ovanför. Försöker också klura ut vad som är en bra grundmall att utgå ifrån.

Som jag har det nu är det väldigt rörigt.

Min css-mall ser ut så här just (kanske inte borde visa upp den men jag gör det ändå :)). Märk väl att det finns en hel del kommaterade saker (ex. färgkoder) som jag remmat när jag exprimenterat:

html, body
{
margin: 0 0 0 0;
padding:0px;
background-color: #F2F2F2;/*#EFEFEF;/*#EAEAEA;/*#F7F7F7;*/
height: 100%;
background-image: url(/picture/bg.jpg);
background-position: center;
background-repeat: repeat-y;	
}

#main
{
min-height: 100%;
width:740px;
border-left: solid 1px #888;/*#8d8d8d;/*#BFBFBF;/*#0D4159;*/
border-right: solid 1px #888;/*#8d8d8d;/*#BFBFBF;/*#BFBFBF*/
margin-left:auto;
margin-right: auto;
background-color: #fff;
}

table { margin: 0; padding: 0; }

img { border:none; margin: 0; padding: 0;}

form { margin:0; }

form input, form textarea, form select { padding: 2px; font: 0.85em verdana, arial, tahoma, serif;}

div, span, td { font-family: verdana, helvetica, impact, sans-serif; font-size: 12px; }

p.article p {
text-align: justify;
text-indent: 1.5em;
line-height:170%;	
}

ul {
margin: 0;
padding: 0;
}

li {
margin: 0;
padding: 0;
}

a
{
color: #0E3171;
background-color: transparent;
text-decoration: none;
}

a:hover
{
color: #FD5908;
background-color: transparent;
text-decoration: underline;
}

#logo
{
padding:0;
margin:0;
}

#metar
{
padding: 2px 20px 2px 19px;
background-color: #f2fc56;
border-top: 2px groove #888;
}

#menu
{
padding:0px 0px 4px 16px;
background-image: url(/picture/menu_bg04.jpg);
/*background-color: #5FB3F0;*/
background-repeat:no-repeat;
/*font-family: kroeger;*/
font: 12px Helvetica, Arial, sans-serif;
color: #000;
border-top: 1px solid #888;
/*border-bottom: 1px solid #173460;*/
height: 23px;
}

#content
{
clear:both;
min-height: 100%;
margin: 0px 0px 0px 0px;
padding: 20px 0px 20px 0px;
}

#content_inline_left
{
float: left;
padding-left: 20px;
padding-right: 25px;
margin: 20px 0 20px 0;
border-right: 1px solid #B8B8B8;
width: 460px;
}

#content_two_columns
{
padding-left: 20px;
padding-right: 20px;
margin: 0px 0 0 0;
margin-left:auto;
margin-right: auto;
width: 697px;
}

#content_two_columns p
{
text-align: justify;	
}

#content_two_columns h1
{
    margin-top: 0;
    margin-left: 0; 
    font-size: 22px;
    color: #0E3171;/*#0E3171#968E2E*/
    font-weight: none;
    letter-spacing: 4px;
   /*font-family: 'Trebuchet'; */	
}

#content_inline_left h1
{
    margin-top: 0;
    margin-left: 0px; 
    font-size: 18px;
    color: #0E3171;/*#6ba81c;/*#FD5908; /*#000;*/
    font-weight: none;
    /*font-style: italic;*/
    letter-spacing: 2px;
}

#content_inline_left h2
{
    margin-top: 0;
    margin-left: 0px; 
    font-size: 14px;
    color: #0E3171;/*#6ba81c;/*#FD5908; /*#000;*/
    font-weight: bold;
    /*font-style: italic;*/
    letter-spacing: 2px;
}

#content_inline_left p
{
text-align: justify;
line-height:170%;		
}

#content_inline_left p.author
{
    font-size: 10px;
    letter-spacing: 2px;
	margin-bottom: 0px;
	line-height:70%;
}

#content_inline_right
{
    float: right;
    width: 190px;
    margin: 20px 5px 0 0;
    padding: 0px 17px 5px 5px;
    text-color: #ffffff;
    border: #888 solid 0px;
    /*background-color: #F1EEE9;/*#F9F9F9;*/
    /*height: 70%;*/
}

#content_inline_right h1
{
    margin-top:0;
    margin-left: 0px; 
    font-size: 13px;
    color: #0E3171;/*#6ba81c;/*#FD5908*/;
    font-weight: bold;
    /*font-style: italic;*/
    letter-spacing: 1px;
}

#infobox_header
{
    padding: 6px 0 6px 15px;
    /*background-color: #0E3171;*/ /*#2F6695;*/ /*FFB923*/ /*9E2061*/ /*62952F*/
    /*background-image: url(picture/bg_right_column.jpg);*/
    border-top: 2px groove #888;
    border-bottom: 2px groove #888;
    border-left: 1px solid #BFBFBF;
    background-color: #000;/*#83D6FE;*/	
	color: #000;
	letter-spacing: 3px;
    font-weight: bold;
}

.infobox_content
{
    padding: 0px 0px 0px 0px;
    /*border-top: #0A364B solid 1px;*/
    /*border-top: 0;*/
    /*border-bottom: #0A364B solid 1px;*/
	/*border-left: #0A364B solid 1px;*/
	/*border-left: 1px solid #BFBFBF;*/
	/*background-color: #BABABA;*/
	color: #000000;
    /*min-height: 100%;*/
}

.infobox_content ul
{
    padding: 0;
    margin:0 0 0 15px;
}

.infobox_content li
{
    /*list-style-type: circle;*/
	padding-left: 7px;
	padding-bottom: 5px;
	margin-left: 0px;
	list-style-type: circle;
	/*list-style-image: url(C:/Program/wamp/www/flygfyren.nu/picture/cessna_bullet.gif);*/
	background-repeat: no-repeat;
	background-position: 0 .5em;
}

.infobox_content li a
{
	color: #0E3171;
	background: transparent;
	/*text-decoration: underline;*/
	/*padding: 5px 6px 6px 0px;*/
}

.infobox_content li a:hover
{
	color: #FD5908;;
	background-color: transparent;/*#FF9B38;*/
	text-decoration: underline;
	/*padding: 5px 0px 6px 0px;*/
}

#content_inline_left ul
{
    padding: 0;
    margin:0 0 0 15px;
}

#content_inline_left li
{
    /*list-style-type: circle;*/
	padding-top: 5px;
	padding-left: 7px;
	padding-bottom: 2px;
	margin-left: 0px;
	list-style-type: circle;
	/*list-style-image: url(C:/Program/wamp/www/flygfyren.nu/picture/cessna_bullet.gif);*/
	background-repeat: no-repeat;
	background-position: 0 .5em;
}

#content_inline_left li a
{
	color: #0E3171;
	background: transparent;
	/*text-decoration: underline;*/
	/*padding: 5px 6px 6px 0px;*/
}

#content_inline_left li a:hover
{
	color: #FD5908;;
	background-color: transparent;/*#FF9B38;*/
	text-decoration: underline;
	/*padding: 5px 0px 6px 0px;*/
}

#belowthebottom {
	clear: left;
  	height: 24px;  /* samma som #bottom */
  	background-color: #fff;
	padding-top: 17px;
        /*margin: 10px 0 40px 0;*/
}
 
#footeroriginal
{
    clear: left;
	width: 740px;
	background-image: url(/picture/footer.jpg);
	/*width: 698px; GAMLA*/ 
    height: 25px;
	margin-top: -28px;
	margin-left:auto;
    margin-right: auto;   
border-top: 2px groove #888;
    /*background-color: #83D6FE;*/
    padding: 15px 0px 5px 0px;
    /*text-align: center;*/
	/*font-weight: bold;*/
    color: #000;
}

#footer
{
    clear: left;
	width: 740px;
	background-image: url(/picture/menu_bg04.jpg);/*background-image: url(/picture/menu_bg04.jpg);
	/*width: 698px; GAMLA*/ 
    height: 21px;
	margin-top: -28px;
	margin-left:auto;
    margin-right: auto;   
border-top: 1px solid #888;
    /*background-color: #83D6FE;*/
    padding: 6px 0px 0px 0px;
    /*text-align: center;*/
	/*font-weight: bold;*/
    color: #000;
}

/*ÖVRIGA INSTÄLLNINGAR*/

.artiklar a
{
	color: #0E3171;
	background: transparent;
	text-decoration: none;
	line-height:160%;
	/*padding: 5px 6px 6px 0px;*/
}

.artiklar a:hover
{
	color: #FD5908;
	background-color: transparent;/*#FF9B38;*/
	text-decoration: underline;
	line-height:160%;
	/*padding: 5px 0px 6px 0px;*/
}

.comment
{
font-weight: bold;
padding-top: 15px;
}

.dotted_line
{
border-bottom: 1px dotted #888;
/*width: 697px;*/
/*margin-bottom: 20px;*/
}

.solid_line
{
border: 1px solid #0E3171;
/*width: 697px;*/
/*margin-bottom: 20px;*/
}

.notregistered
{
font-size: 14px;
text-align: center;
margin-left: 75px;
margin-right: 75px;
margin-top: 30px;
padding: 0px;
background-color: #fff;
border: 0px groove #fff;
/*border-top: 1px dotted #83D6FE;*/
}

.profilepadding
{
padding-right: 0px;
}

.profile_basic_facts
{
padding-top: 4px;
padding-left: 10px;
/*vertical-align: bottom;*/
/*font-weight: bold;*/
border-bottom: #888 solid 1px;
font-size: 11px;
}

.profile_action a 
{
	color: #000;
	text-decoration: none;
	padding: 4px 7px 4px 7px;
}

.profile_action a:hover
{
	color: #ff0000;
	/*background-color: #D0EEFD;*/
	background-color: #6ba81c;/*#FD5908;*/
	text-decoration: none;	
	padding: 4px 7px 4px 7px;
}

.profile_action a:active
{
	color: #ff00ff;
	/*background-color: #D0EEFD;*/
	background-color: #FD5908;
	text-decoration: none;	
	padding: 4px 7px 4px 7px;
}

.picturetext
{
font-style: italic;
padding: 0 0 0 0;
margin: 0;
line-height: 13px;
font-size: 10px;
}

...fortsätter i nytt inlägg...