leider falsches forum, ich verschieb das mal..

Mit Kritik und Verbesserungen ist in diesem Falle das IlchCMS gemeint...

ich finde das standard design besser.....

@ Ithron - sry wegen falschem Forum, fand es auch schwierig dasrichtige Forum dafür zu finden.

@ jankrug - super Kommentar...
Zur Sache: Die Menüpunkte sollen nicht so verzogen sein. Die Darstellung ist nur im IE so. Bei uns im Clan nutzen alle FF, hab das deswegen das Problem mit der IE darstellung fast vergessen gehabt. Wie kann ich das denn überhaupt ändern ohne das es dann wiederrum im Mozilla FF schlecht aussieht..?

Bislang ist Eure Kritik leider eher destruktiv. Ich könnte Hilfe dahingehend gebrauchen, dass ihr Vorschläge zur Verbesserung macht (wie der Thread Name ja sagt).. alles andere brauche ich nicht.

Danke im Vorraus.


Zuletzt modifiziert von nerom am 23.05.2007 - 01:09:35

Lol, das einzige was ihr wirklich verändert habt ist die Fehldarstellung im IE...

Frag mich zwar wie man sowas codet, aber ich würde sagen schlechtes html, weil IE fixed die html dateien vorm abrufen immer, das kann sowohl nach vorne, alsob nach hinten losgehen.

Der FF stellt alles genauso dar, wie es ihm gesagt wird.

Hilfe gesucht für folgendes:

Ich möchte die Menülinks auf der linken Seite mit einem Hover Effekt versehen. Sie sollen einfach nur in bold oder anders farbig beim Mouseover erscheinen.
Ich habe jetzt ewig lang mich durch die Suchfunktion gequält und dennoch habe ich es nicht geschafft. Ich konnte auch kaum weitere Erklärungen für die einzelnen Codes der style.css finden und über selfhtml komm ich so auch nicht weiter.
Ich habe diesen code gefunden

A:hover {color:#9F9F9F;
text-decoration:underline;
font-family:Arial;
font-size:12pt;

, aber ich finde nicht den richtigen Platz dafür in meiner style.css, so dass es funktioniert.

/*
  css Datei copyright by ilch.de
  erstellt von scaRFhogg
  seite: www.daiwai.de
  
  --
  
  Design copyright by ilch.de
  erstellt von fanguro
  seite: www.zurro.de
  
  --
  
  Support auf www.ilch.de
*/

body {
  margin: 0;
  padding: 0;
  text-align: center;
  background-color: #4A4849;
  font-size: 12px;
  font-family: Verdana, sans-serif;
}
#wrap {
  position: relative;
  width: 810px;
  text-align: left;
  margin: 0 auto 0 auto;
}
#top {
  background: url(img/top.gif);
  height: 20px;
}
#header {
  background: url(img/logo.gif);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}
#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 24px;
}
#top2 {
  background: url(img/top2.gif);
  height: 31px;
}
#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}
#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
}
#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}
#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #fff;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #CCCCCC;
}

#left_col .menu_heading
{
  color: #000;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 14px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading,
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.gif) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.gif) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #fff;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a 
{
  color: #003366; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: none; 
}

a:hover 
{   
  color: #003366;  
	font-style: none; 
	text-decoration: underline; 
}

a.box 
{ 
  color: #003366; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a.box:hover 
{   
  color: #003366;
	font-style: none; 
	text-decoration: underline;  

}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}
.Cmite
{
  background-color: #B4C6D8;
}
.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}
hr 
{ 
    height: 0px; 
		border: solid #003366 0px; 
		border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
  	border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}

Zuletzt modifiziert von nerom am 24.05.2007 - 03:51:56

jawoll mit kleiner Abweichung funzt das prima, halt noch text_weight: bold und font-size:12px.

THX 4 Mairu

Wo ich jetzt so einen versierten Helfer hier hab.. frag ich doch gleich mal weiter

1.
Die Darstellung im IE sieht jetzt wieder kagge aus, nach der css Erweiterung um den Hovereffekt. Kann man da was ändern oder muss ich das akzeptieren?

2. Ich möchte das das Login Menü nicht von dem Hover Effekt betroffen ist. An welcher Stelle und Was muss ich in der style.css eingeben? Edit: Erledigt, habs iwie geschafft, aber wo genau wird die Login Box bestimmt.. jetzt ist die Login Begrüßung nämlich schwarz^^.. wär noch besser, wenn sie zB rot sein könnte.

3. Auf der rechten Seite die Box mit Upcoming Match will sich nicht so verhalten wie die übrigen Boxes mit dem Hovereffekt auf der rechten Seite. Woran liegt das? Wo finde ich die passende Stelle, die die Box "Upcoming Match" bestimmt.

4. Dann möchte ich noch, dass die Überschriften der News keinen Hovereffekt bekommen, mir fehlt die Stelle, wo dies bestimmt werden kann. Ich sehe nur header und header h1, aber die sind es nicht.

5. Noch besser wäre es, wenn der Hovereffekt erweitert werden könnte auf die Pfeil Images im linken Menü. Sprich ist es möglich, dass bei Mouseover die Pfeilimages vor dem Link nach rechts eingerückt werden? Wenn ja, was muss ich ändern, einfügen?

Edit: Ich hab jetzt dran rumgepfuscht, aber das will nicht klappen mit der Verschiebung der Pfeilimages.

#left_col ul:hover
{
  padding: 1px;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 148px;

Edit2: Jetzt habe ich zusätzlich noch iwie Mist gebaut bei den Links der Boxen rechts. Obwohl nirgends die Angaben für a:visited gesetzt sind in der style.css habe ich jetzt diese typischen lila visited links.. und eine andere schriftart. argh.
Edit: Erledigt, dazu musste ich nur die index htm überarbeiten. Dort waren die Angaben gemacht.

Hier nochmal meine aktuelle css datei

/*
  css Datei copyright by ilch.de
  erstellt von scaRFhogg
  seite: www.daiwai.de
  
  --
  
  Design copyright by ilch.de
  erstellt von fanguro
  seite: www.zurro.de
  
  --
  
  Support auf www.ilch.de
*/

body {
  margin: 0;
  padding: 0;
  text-align: center;
  background-color: #4A4849;
  font-size: 12px;
  font-family: Verdana, sans-serif;
}
#wrap {
  position: relative;
  width: 810px;
  text-align: left;
  margin: 0 auto 0 auto;
}
#top {
  background: url(img/top.gif);
  height: 20px;
}
#header {
  background: url(img/logo.gif);
  height: 153px;
  text-align: center;
  vertical-align:middle;
}
#header h1 {
  display: inline;
  position: absolute; 
  top: 110px; left: 100px;
  color: #fff;
  font-family: 'Trebuchet MS';
  font-weight: normal;
  font-size: 24px;
}
#top2 {
  background: url(img/top2.gif);
  height: 31px;
}
#top2 font {
  display: inline;
  position: absolute; 
  left: 172px;
  margin-top: 2px;
  font-size: 10px;
	text-decoration: none; 
}
#content {
  background: url(img/contentbg.gif);
  background-repeat: repeat;
}
#footer {
  background: url(img/footer.gif);
  height: 33px;
  text-align: center;
  vertical-align: middle;
}
#left_col {
  width: 158px;
  float: left;
  padding-top: 0px;
  padding-left: 9px;
  padding-right: 18px;
  padding-bottom: 0px;
  color: #fff;
  overflow: hidden;
}

#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
  color: #000000;
}

#left_col a {
  color: #CCCCCC;
}

#left_col a:hover {    //-Menü Hover links
  color:#ffffff;
  text-decoration: underline;
  text_weight: none;
  font-family: Verdana;
  font-size: 12px;
}

#left_col .menu_heading  //-Überschriften über dem Menü links
{
  color: #000;
  display:block;
  letter-spacing: 1px;
  font-size: 11px;
  padding: 0  0 3px 5px;
}

#main_col {
  width: 440px;
  float: left;
  padding-top: 0px;
  padding-left: 5px;
  padding-right: 20px;
  padding-bottom: 0px;
  clear: none;
  min-height: 100px;
  overflow: auto;
}
#right_col1 { 
  width: 141px;
  float: left;
  padding-top: 0px;
  padding-left: 7px;
  padding-right: 10px;
  padding-bottom: 0px;
  overflow: hidden;
}
#right_col2 { 
  width: 141px;
  float: right;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 14px;
  padding-bottom: 0px;
  overflow: hidden;
}

#right_col1 .menu_heading,
#right_col2 .menu_heading 
{
  color:#fff;
  font-size:11px;
  letter-spacing: 1px;
}

#left_col ul
{
  padding: 0;
  margin: 0;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 149px;
}

#left_col ul:hover
{
  padding: 0;
  margin: 1px;
  list-style: inside url(img/box_menu_pfeil.gif);
  width: 148px;
}

#left_col li
{
  margin:0;
  padding: 5px 0 0 2px;
  background: url(img/box_menu_trennlinie.gif) no-repeat bottom;
} 

#left_col li ul
{
  width: 146px;
  background: url(img/box_menu_trennlinie.gif) no-repeat top;
}

#left_col li li
{
    padding-left: 16px;
}
#left_col li a
{
  color: #fff;
  padding-left: 8px;
  font-size: 11px;
  font-weight: normal;
  text-decoration: none;
}

td 
{
  font-family: Verdana; 
  font-size: 12px;
}

a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a //-Bestimmung der Links in den Boxen und im Text!
{
  color: #003366; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: underline; 
}

a:hover //-Hovereffekt allgemein
{   
  color: #003366; 
	font-family: Verdana; 
	font-style: none; 
	text-decoration: none; 
}

a.box //-Bestimmung der Boxen
{ 
  color: #003366; 
	font-family: Verdana; 
	font-size: 11px; 
	text-decoration: none;
}

a.box:hover //-Hovereffekt der Boxen
{   
  color: #003366;
	font-family: Verdana; 
	font-style: none; 
	text-decoration: none;  
}

.Chead
{
  background: #16639b;
  color: #9dbdd4;
}

.Chead td, .Chead td strong, .Chead h4, .Chead td b
{
  background: #16639b;
  color: #9dbdd4;
}

.Callg
{
  background-color: #EFEFEF;
	color: #000000;
}

.Callg td
{
  color: #000000;
}

.Cnorm 
{
  background-color: #e5e5e5;
}
.Cmite
{
  background-color: #B4C6D8;
}
.Cdark
{
  background-color: #9AB1C8;
}

.rand
{
  border: solid #185685 1px;
}

.smalfont 
{ 
    font-size: 10px;
		text-decoration: none; 
}

.border 
{ 
   background-color: #185685; 
}
hr 
{ 
    height: 0px; 
		border: solid #003366 0px; 
		border-top-width: 1px; 
}

input, textarea, select
{ 
    color: #000000;  
    font: 12px Verdana;  
    border-color: #185685;
  	border-width: 1px;
    border-style: solid;  
    font-weight: none;  
    text-decoration: none;  
    background-color: #EFEFEF;  
}

Zuletzt modifiziert von nerom am 24.05.2007 - 16:34:52

also unübersichtlich ist es definitiv...

extremgaming.ex.funpic.de

Naja ich würde empfehlen, nochmal beim Standarddesign anzufangen, dann sollte das mit dem verschieben weg sein.
Wenn die Schrift keine eigene Klasse hat, kannst du auch kein eigenen Stil zuordnen, also Klasse vergeben und in der style.css einfügen.
Zum einrücken, musst du halt beim Hover noch padding-left:10px; oder so machen.