Abstand zwischen 2 Tabellen

Noke · 13 Oktober 2009

Hallo erstmals. Ich habe ein kleines Problem:

Auf meiner Homepage habe ich einen Abstand zwischen Banner (eigene Tabelle) und Navigation(eigene Tabelle).
Ich hätte nun aber gern, dass dort kein abstand ist und die Navigation und der Banner bindend ineinander gehen.

hier die HP: team-eof.ch || Freerunning and Parkour Switzerland

HTML Code:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>team-eof.ch || Freerunning and Parkour Switzerland</title>
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="format.css" type="text/css">

</head>
<body>

<table border="0" width="800" height="250" align="center" cellpadding="0" cellspacing="0" align="bottom">
<tr>
<td valign="bottom">
<img src="images/top.png">
</td>
</tr>
</table>


<td   width="100%"     id="leiste1" ><!--menü oben-->
<table    id="menu2" width="800"  border="0" cellpadding="0" cellspacing="0" align="center">


<td width="15%" ><a href="index.html"  onfocus="this.blur()">-Home-</a></td>
<td width="15%"><a href="team.html"  onfocus="this.blur()">Team</a></td>
<td width="15%"><a href="videos.html" onFocus="this.blur()">Videos</a></td>
<td width="15%"><a href="pictures.html"  onfocus="this.blur()">Pictures</a></td>
<td width="25%"><a href="prodow.html"  onfocus="this.blur()">Projects / Downloads</a></td>
<td width="15%"><a href="stokon.html" onFocus="this.blur()">Story / Kontakt</a></td>

...

CSS code:

Code:

body
{margin-top: 0px; margin-left: 0px; margin-right: 0px;margin-bottom: 0px;background-color: #000;padding:0px;
background-image:url(images/new.jpg);
}

.pictures {background-color: transparent}



.bg{
background-color:#333333;
}

.bg1{
background-image:url(images/bg1.jpg);
}

p{
font-family:arial;
font-size:12px;
color:#CCCCCC;
padding-right: 10px;
padding-left: 10px;
}


.downloads {    
        font-family:Arial, Helvetica, sans-serif;
        color:#CCCCCC;
        font-size: 11;
        text-align:left;
                font-weight:bold;
        }



li{
font-family:arial;
font-size:12px;
color:#CCCCCC;
padding-right: 10px;
padding-left: 10px;
}




pers{
font-family:arial;
font-size:12px;
color:#CCCCCC;
padding-right: 10px;
padding-left: 10px;
font-weight: bold;
}

h2{ color:#ffffff;
padding-top: 5px;
margin-bottom:20px;letter-spacing:0px;
font-family: arial;font-size: 110%;
text-align: left;
padding-right: 10px;
padding-left: 10px;
}

.default{
font-family:arial;
font-size:10px;
color:#FFFFFF;
 margin-right:0px;
}

#menu2 a, #menu2 a:visited , #menu2 a:active {display: block;
color:#FFFFFF;
background-color:#4f4f4f;
text-decoration:none ;font-family:verdana,arial, sans-serif;
padding-top:0px;
padding-bottom:0px;
padding-right:0px;
padding-left:0px;
margin-left: 0px;margin-right: 0px;
border:solid 0px #353535;
line-height:34px;
text-align:center;
font-size: 80%;
font-weight: bold;

background-image:url(images/ob2.jpg);
}


#menu2 a:hover {background-color:#ffcc66;color:#fff; text-decoration:none ;border:solid 0px #353535;

background-image:url(images/mover.jpg);
}



.li {
width:26px;
background-image:url(images/rand1.jpg);
border-right:solid 0px #000;border-left:solid 0px #808080;
}

.li2 {
width:26px;
background-image:url(images/rand2.jpg);
border-right:solid 0px #000;border-left:solid 0px #808080;

}

td {
font-family: arial, helvetica, tahoma ,verdana,  sans-serif;
text-align:justify;font-size: 94%;line-height: 125%;
}


.newsbg {
background-image:url(images/newsbg.jpg);
}





        
.green {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color: #000000;
        background-color:#9acd32;
        }
        
.purple {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color: #000000;
        background-color:#dda0dd;
        }
        

.orange {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color: #000000;
        background-color:#ffa500;
        }
        
.yellow {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color:#000000;
        background-color:yellow;
        }
        
.brown{
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color:#000000;
        background-color:maroon;
        }
        
.blue {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color:#000000;
        background-color:lightblue;
        }
        




.movies {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
        font-style: bold;
        color: #FFFFFF;
        background-color:darkred;
                text-align:left;
        }
        
        
        
.linkpic
        {
        border: 3px solid black;
        text-decoration:none;
        }

.linkpic2
        {
        border: 0px solid black;
        text-decoration:none;
        }
        
        
        /* allgemeine links im text */

a:link, a:visited, a:active{ font-family: arial, helvetica, tahoma ,verdana,  sans-serif;
font-size: 97%;line-height: 125%;
text-decoration:underline;color:#56686D;}

a:hover{ text-decoration:none;background-color:#fff;
color:#222222;}

Kann mier jemand weiterhelfen? Hab schon viel versucht.. ging leider nichts :sad:

Danke

XraYSoLo · 13 Oktober 2009

als erstes würde ich an deiner stelle mal die validierungsfehler beseitigen. danach deinen code überarbeiten, da der einsatz von tabellen zu designzwecken weder vorteilhaft noch semantisch korrekt ist.
tabellen weg und mit CSS arbeiten, da kannst du abstände pixel für pixel festsetzen, sogar überlappen - was mit tabellen nicht funktionier - geht.

Nils aka XraYSoLo

Noke · 13 Oktober 2009

Naja.. ich möchte es jedoch Tabellen orientiert lassen, denn es funktioniert ja eigentlich und ausserdem ist es mir um einiges sympatischer. Ich werde also diese Tabellen lassen.

Zu den "validierungsfehler" kann ich eines sagen: Das zeigt mir ne menge fehler an welche gar keine fehler sind oder sowieso kein ausmass haben..

Habs gefunden in nem andern forum...

was ich gesucht habe ist:

style="display: block;"

_Thor_ · 14 Oktober 2009

Noke schrieb:
Naja.. ich möchte es jedoch Tabellen orientiert lassen, denn es funktioniert ja eigentlich und ausserdem ist es mir um einiges sympatischer.

Es geht aber bei einer Webseite nicht darum, dass sie dir gefällt, sondern deinen Besuchern, denn für die machst du sie ja schließlich, oder?

Man kann mit Tabellen eine Webseite gestalten, man kann aber auch mit einem Bobbycar auf der Autobahn fahren, beides ist nicht weise.

HTML dient der Auszeichnung deines Inhaltes, du gibst ihm damit also eine Bedeutung. Das ist wichtig für alle Geräte und Benutzer, die deine Seite nicht "sehen" können, sondern auf Hilfsmittel angewiesen sind. Wenn du alles als Tabelle auszeichnest, können diese Besucher nicht unterscheiden, was eine Überschrift ist, was ein Textabsatz ist, was eine Liste ist usw. Für sie sind das alles tabellarische Daten, was aber nicht stimmt. Diese Besucher müssen sich also denken, entweder ist die Seite von einem schlechten Webmaster, oder ihm ist es egal und er verzichtet gerne auf ein paar Besucher.

Ich werde also diese Tabellen lassen.

Dann hast du den Sinn von HTML noch nicht verstanden.

Zu den "validierungsfehler" kann ich eines sagen: Das zeigt mir ne menge fehler an welche gar keine fehler sind oder sowieso kein ausmass haben..

Es ist möglich, dass es durch einen Fehler am Anfang zu Folgefehlern kommt, die eigentlich keine sind. Sinnvoll ist es daher bei der Fehlerbehebung von vorne zu beginnen, dann verschwinden auch die Fehler, die eigentlich garkeine sind.

Deine Fehler haben vielleicht keine sichtbaren Auswirkungen, weil die Browser so freundlich sind, sie für dich so gut es geht zu ignorieren, aber für andere Geräte haben sie sehr wohl Auswirkungen, womit wir wieder bei dem Thema Barrierefreiheit wären...

Noke · 14 Oktober 2009

_Thor_ schrieb:
Es geht aber bei einer Webseite nicht darum, dass sie dir gefällt, sondern deinen Besuchern, denn für die machst du sie ja schließlich, oder?

Man kann mit Tabellen eine Webseite gestalten, man kann aber auch mit einem Bobbycar auf der Autobahn fahren, beides ist nicht weise.

HTML dient der Auszeichnung deines Inhaltes, du gibst ihm damit also eine Bedeutung. Das ist wichtig für alle Geräte und Benutzer, die deine Seite nicht "sehen" können, sondern auf Hilfsmittel angewiesen sind. Wenn du alles als Tabelle auszeichnest, können diese Besucher nicht unterscheiden, was eine Überschrift ist, was ein Textabsatz ist, was eine Liste ist usw. Für sie sind das alles tabellarische Daten, was aber nicht stimmt. Diese Besucher müssen sich also denken, entweder ist die Seite von einem schlechten Webmaster, oder ihm ist es egal und er verzichtet gerne auf ein paar Besucher.

Dann hast du den Sinn von HTML noch nicht verstanden.

Es ist möglich, dass es durch einen Fehler am Anfang zu Folgefehlern kommt, die eigentlich keine sind. Sinnvoll ist es daher bei der Fehlerbehebung von vorne zu beginnen, dann verschwinden auch die Fehler, die eigentlich garkeine sind.

Deine Fehler haben vielleicht keine sichtbaren Auswirkungen, weil die Browser so freundlich sind, sie für dich so gut es geht zu ignorieren, aber für andere Geräte haben sie sehr wohl Auswirkungen, womit wir wieder bei dem Thema Barrierefreiheit wären...

0_o

Die besucher schauen ja nicht den verdammten code an sonder die webseite... :/
Naja... das andere forum hat mir wohl mehr gehoflen... diese validierungsfehler sind alle inkorrekt weils keine sind.
TD, meinten sie "td". TABLE, meinten sie "table"....
Ich habs ja nie gross geschrieben ...WTF

tschüss, könnt mich bannen. Brauche nun keine hilfe mehr dieses forums in irgentwelcher hinsicht.

_Thor_ · 14 Oktober 2009

Noke schrieb:
Die besucher schauen ja nicht den verdammten code an sonder die webseite... :/

Es geht ja auch um die, die nicht sehen können, die sind auf semantisch korrekten Quellcode angewiesen. Aber du brauchst ja keine Hilfe mehr...

XraYSoLo · 14 Oktober 2009

wieder so eine kinderreaktion...

Closed: Sinnlos ausartende Diskussion uneinsichtiger Poster (XraYSoLo)

Nils aka XraYSoLo

Abstand zwischen 2 Tabellen

Noke

Neues Mitglied

XraYSoLo

Senior HTML'ler

Noke

Neues Mitglied

_Thor_

Aktives Mitglied

Noke

Neues Mitglied

_Thor_

Aktives Mitglied

XraYSoLo

Senior HTML'ler

Neueste Beiträge