Lücke zwischen 2 Tabellen

Status
Nicht offen für weitere Antworten.
G

GENESIS2005

Mitglied
Huhu,

Also ich habe meine Seite nochmals umstrukturiert und habe mich nun entschlossen eine Navigation seitlich anzubringen. Dazu habe ich eine große Tabelle erzeugt mit einer Spalte und 2 Zeilen. In der oberen Zeile ist eine weitere Tabelle enthalten mit einer Zeile und 3 Spalten. Maße sind: 100px,800px,100px also insgesamt 1000 pixel so wie die erste große Tabelle. In der zweiten Zeile ist auch wieder eine Tabelle enthalten die mir eine andere Aufteilung erlaubt. Maße sind: 150px,750px,100px. In die linke Spalte kommt nun wieder eine Tabelle, welche die Navigation beinhalten soll.

Das einzige Problem ist: Zwischen dem Bild und der Navigation ist ein Spalt, der ausschließlich im Internet-Explorer zu sehen ist.

Developer Planet

Weiß einer Rat?

MFG.

GENESIS2005
 
Mittlerweile hat sich die Sache erledigt, aber... Ich hab nun im <img> Tag reingeschrieben: align="absmiddle".

Ich weiß nicht ob das eine elegante Lösung ist... kann mir da jemand weiterhelfen?
 
Hallo!

Warum machst Du es nicht so?

CSS
Code: 
 html, body { width:100%; height:100%; margin:0px 15px; padding:0px; }
HTML: 
 <body class="bodystyle">
 
<!-- Haupttabelle -->
<table width="1000" border="1" cellpadding="0" cellspacing="0">
<tr>
	<td width="1000" height="100" colspan="3" style="text-align:center;">
	 <img src="bilder/banner.jpg" width="800" height="100" alt="Developer Planet">
	</td>
</tr>
<tr>
	<td width="150">
	 &nbsp;
	</td>
	<td width="750">
	 &nbsp;
	</td>
	<td width="150">
	 &nbsp;
	</td>
</tr>
<tr>
	<td width="150">
	 <ul class="ulnavi">
	 <li class="linavihead">News</li>
	 <li class="linavi">Aktuell</li>
	 <li class="linavi">Archiv</li>
	 <li class="linavihead">C#/C++</li>
	 <li class="linavi">Dos-Programmierung</li>
	 <li class="linavi">Windows-Programmierung</li>
	 <li class="linavi">MFC</li>
	 <li class="linavi">Tipps &amp; Tricks</li>
	 <li class="linavi">Tutorials</li>
	 <li class="linavi">Tools</li>
	 <li class="linavihead">Webgestaltung</li>
	 <li class="linavi">HTML / CSS</li>
	 <li class="linavi">Javascript</li>
	 <li class="linavi">PHP</li>
	 <li class="linavi">Tipps &amp; Tutorial</li>
	 <li class="linavi">Tutorials</li>
	 <li class="linavi">Tools</li>
	 <li class="linavihead">Multimedia:</li>
	 </ul>links
	</td>
	<td width="750">
	 &nbsp;
	</td>
	<td width="150">
	 &nbsp;
	</td>
</tr>
</table>
</body>
Gruss Dr Dau
 
Huhu

Also wenn ich das richtig sehe, hast du da nun eine große, globale Tabelle geschrieben, die alle Inhalte in sich trägt. Mhh auch ne Idee. Ich habe mir bei meiner Sache gedacht, dass es einfacher wäre eine große, globale Tabelle zu machen, in der weitere Tabellen sind, damit ich es einfacher habe verschiedene Layouts zu verwenden.

Ich probiere das Ganze mal aus... habe aber gleich noch ne Frage. Die Zeilenhöhe also
"height" kann minimal nur einen Wert von 19px annehmen. Wie schaffe ich es den Wert noch niedrieger zu bekommen. Ich schiele dabei auf die Navigation, welche mit Listen gemacht wurde und leider noch etwas zu groß ist.

*Edit*

Das mit der großen Tabelle ist keine schlecht Idee, aber der Streifen ist nun wieder da :P.
Wenn du mal Strg+A drückst siehst du das.

MFG

GENESIS2005
 
Zuletzt bearbeitet:
Diese ganze Klassifizierung ist garnicht nötig. Moderne Browser kommen auch mit folgender geschickten Nutzung der Selektoren zurecht:
HTML: 
<ul id="nav-main">
	<li>News<ul>
		<li>Aktuell</li>
		<li>Archiv</li>
	</ul></li>
	<li>C#/C++<ul>
		<li>Dos-Programmierung</li>
		<li>Windows-Programmierung</li>
		<li>MFC</li>
		<li>Tipps &amp; Tricks</li>
		<li>Tutorials</li>
		<li>Tools</li>
	</ul></li>
	<li>Webgestaltung<ul>
		<li>HTML / CSS</li>
		<li>Javascript</li>
		<li>PHP</li>
		<li>Tipps &amp; Tutorial</li>
		<li>Tutorials</li>
		<li>Tools</li>
	</ul></li>
	<li>Multimedia<ul>
		<li>Audiobearbeitung</li>
		<li>Videobearbeitung</li>
		<li>Bildbearbeitung</li>
		<li>3D-Modelling</li>
		<li>Tipps &amp; Tutorial</li>
		<li>Tutorials</li>
		<li>Tools</li>
	</ul></li>
	<li>Forum</li>
	<li>Downloads</li>
	<li>AGB</li>
	<li>Links</li>
</ul>
Code: 
#nav-main {
	width:			12em;
	border:			solid #000;
	border-width:		1px 1px 0 1px;
}
#nav-main,
#nav-main * {
	list-style:		none;
	margin:			0;
	padding:		0;
}
#nav-main > li {
	border-bottom:		1px solid #000;
	background:		url(http://home.arcor.de/genesis2004/bilder/navihead.jpg) repeat-x;
}
#nav-main li ul {
}
#nav-main li ul li {
	border-top:		1px solid #000;
	background:		#e5e5e5;
}
Auch die Nutzung von Tabellen als Layoutwerkzeug ist nicht nötig. Siehe dazu „Warum Layout mit Tabellen dumm ist: Probleme definiert, Lösungen angeboten“.
 
Hallo,

Ich glaube ich werde nochmal meine ganze Seite ohne Tabellen aufbauen. Die Seite auf welcher das erklärt wird gibt mir einen recht guten Eindruck davon.

Danke dir!
 
Welchen Spalt meinst Du?
Den der direkt unter dem Banner ist? Dann nehme dort die Zellenreihe raus.
Den Spalt links und rechts? Dann nehme bei margin die 15px raus.

Prinzipiell hat Gumbo mit dem Layout schon recht, nur sollte man auch bedenken das einige Sachen mit Tabellen halt viel einfacher zu lösen sind als mit DIV's.
Siehe hierzu auch den 2. Link in meiner Signatur.
Im 1. Link meiner Signatur findest Du Beispiele wie man dieses mit DIV's lösen könnte, wobei das 3. Beispiel noch Darstellungsprobleme in Opera hat.

Ich persönlich baue mein Layout lieber in ein paar Minuten mit Tabellen, als mich stundenlang mit DIV's rumzuärgern.
Wem dass nicht passt, braucht sich meine Seiten ja nicht anzusehen. :p
 
Prinzipell habt ihr beide recht^^. Ich probiere alle Varianten mal aus. Kann ja nicht schaden über CSS mal etwas mehr zu lernen. Vielleicht schaff ich es ja ein Mittelding aus beiden Varianten zusammen zu bauen.
 
Was mich aber auch immer wieder verwundert ist, dass Leute die gegen Tabellen sind, sich auf Seiten wie dieser (die vor lauter Tabellen nur so strotzt) rumtreiben. ;)
Grenzt sowas nicht schon an perversität?! :-)

Nur mal so als :offtopic: .
 
@Gumbo

Dein CSS funktioniert nur fast richtig. Die Backgrounds sind grau, aber das Bild wird nicht bei News usw. hineingesetzt. D.h. ich habe einen weißen Hintergrund bei News und graue Hintergründe bei den dadrunter.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück