CSS - Dein Feind und Gegner - wie kann ich ...

[Bodo Thiesen]

Hallo Leute

Irgendwie verzweifele ich gerade.

Also, ich möchte gerne auf Unserer Wikiseite das Inhaltsverzeichnis in das gleiche Box-Layout bringen, wie die ganzen anderen Boxen. Nun packt MediaWiki das Inhaltsverzeichnis leider nicht in div-Container sondern baut da eine »schöne« Tabelle drum (mit genau einer Zelle). Ich habe mich da heute früh schon ein bischen versucht und bin auch fast fertig, die Überschrift hat den orangen Hintergrund, nur gibt's da (zumindest beim Opera) so einen weißen Freiraum zwischen der Umrahmung und der Überschrift. (Die Schriftarten passen auch noch nicht, aber das bekomme ich wohl noch in den Griff.)

Ist das ein Opera-Bug oder habe ich das CSS-technisch was (was?) übersehen?

Gruß, Bodo

Ausschnitt auf dem HTML-Code:

<div style="width:25%; float:left;">  
<table id="toc" class="toc" summary="Inhaltsverzeichnis"><tr><td><div id="toctitle"><h2>Inhaltsverzeichnis</h2></div>  
<ul>  
<li class="toclevel-1"><a href="#Kontakt"><span class="tocnumber">1</span> <span class="toctext">Kontakt</span></a></li>  
<li class="toclevel-1"><a href="#Arbeitsgruppen"><span class="tocnumber">2</span> <span class="toctext">Arbeitsgruppen</span></a></li>  
<li class="toclevel-1"><a href="#Projekte"><span class="tocnumber">3</span> <span class="toctext">Projekte</span></a></li>  
<li class="toclevel-1"><a href="#Organe"><span class="tocnumber">4</span> <span class="toctext">Organe</span></a></li>  
<li class="toclevel-1"><a href="#Konto"><span class="tocnumber">5</span> <span class="toctext">Konto</span></a></li>  
<li class="toclevel-1"><a href="#Mitgliederstand"><span class="tocnumber">6</span> <span class="toctext">Mitgliederstand</span></a></li>  
<li class="toclevel-1"><a href="#Unterschriften"><span class="tocnumber">7</span> <span class="toctext">Unterschriften</span></a></li>  
</ul>  
</td></tr></table><script type="text/javascript"> if (window.showTocToggle) { var tocShowText = "Anzeigen"; var tocHideText = "Verbergen"; showTocToggle(); } </script>  
<div style="border:1px solid #ff8800; margin-bottom:5px;">  

Und meine monobook.css:

#toc {  
	border:1px solid #ff8800;  
	margin-bottom:5px;  
	padding:0px;  
	width:100%;  
	// margin:0px; Verursacht, daß unter dem Inhaltsverzeichnis kein Freiraum mehr zum nächsten Container angezeigt wird.  
}  
  
#toc tr {  
	padding:0px;  
	margin:0px;  
	border:1px dashed #00ff00;  
}  
  
#toctitle {  
	background:#ff8800;  
	border:0px solid #ff8800;  
}  
  
#toctitle h2 {  
	color:#ffffff;  
	padding-bottom:1px;  
	padding-top:1px;  
	padding-right:10px;  
	padding-left:10px;  
}  
  
#toc ul {  
	padding:10px  
}

[ChrisB]

Hi,

die Überschrift hat den orangen Hintergrund, nur gibt's da (zumindest beim Opera) so einen weißen Freiraum zwischen der Umrahmung und der Überschrift.

"Wie Sie sehen, sehen Sie nichts."

Kann dein Problem mit Opera 9.64/Vista nicht nachvollziehen.

MfG ChrisB

[Elya]

Hallo Bodo,

Ist das ein Opera-Bug oder habe ich das CSS-technisch was (was?) übersehen?

Pack das CSS doch bitte mal in die common.css statt in deine persönliche monobook, sonst sehen wir nämlich nix ;-)

Gruß aus Köln-Ehrenfeld,

Elya

[Bodo Thiesen]

Hallo Elya

»» Ist das ein Opera-Bug oder habe ich das CSS-technisch was (was?) übersehen?

Pack das CSS doch bitte mal in die common.css statt in deine persönliche monobook, sonst sehen wir nämlich nix ;-)

Naja, das geht irgendwie nicht, weil produktive Umgebung und so. Ich habe jetzt aber das CSS in unserem »Niemand2«-Account gelegt. Dort könnt ihr euch mit dem Passwort »wiki« einloggen. Damit könnt ihr das dann nachvollziehen.

Gruß, Bodo

[Elya]

Hallo Bodo,

Naja, das geht irgendwie nicht, weil produktive Umgebung und so. Ich habe jetzt aber das CSS in unserem »Niemand2«-Account gelegt. Dort könnt ihr euch mit dem Passwort »wiki« einloggen. Damit könnt ihr das dann nachvollziehen.

Diff

Das !important kannst du vielleicht noch wegnehmen, und an die Schriftformatierng mußt Du nochmal ran, aber sonst  aber so sollte es so klappen. Firebug ist übrigens ein gutes Werkzeug zum CSS-Debuggen ;-)

Gruß aus Köln-Ehrenfeld,

Elya

[Bodo Thiesen]

Hallo Elya

Diff

Das !important kannst du vielleicht noch wegnehmen, und an die Schriftformatierng mußt Du nochmal ran, aber sonst  aber so sollte es so klappen. Firebug ist übrigens ein gutes Werkzeug zum CSS-Debuggen ;-)

An den border-collapse habe ich jetzt echt nicht gedacht.

Das "!important" scheint in der Tat weder der Opera noch der Feuerfuchs zu brauchen.

Auf jeden Fall eine großes Danke für die Hilfe. ;)

Gruß, Bodo