Verschiebungen und Verzerrungen mit FF und Co.

whiskey · #1 (**permalink**) 28.09.2004, 12:32

Hey ihr lieben Leute

Ich sitze hier gerade an einem Mac. Zuerst habe ich HTMl-Code geschrieben, den ich jetzt zu XHTML umgeschrieben habe.
Problem nur: Bei HTML funktionierte meine seite einwandfrei (in ALLEN Browsern). nach der Abwandlung in XHTML funktioniert die Seite im Firefox nicht mehr richtig (im IE hingegen immer noch).
Bei FF sind viele weiße Ränder zwischen den Tabellen, vieles ist "zerrissen" und ich habe keine Ahnung, wieso..
Wer kann mir helfen?
Habe leider zZ keine Möglichkeit, die seite online zu stellen, aber vllt. weiß ja jemand von euch so, um welches problem es sich handelt

Liebe Grüße, Manuel

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>&raquo;Manu in Red&laquo;</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="language" content="de" />
<meta name="robots" content="index, follow" />
<meta name="Expires" content="0" />
<style type="text/css" media="all" /></style>
</style>
<meta http-equiv="page-exit" content="blendTrans(Duration=0.4)" />
<meta http-equiv="page-enter" content="blendTrans(Duration=0.4)" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript">
<!--
function protec() {
var win;
win=window.open("protec.htm","images","height=600,width=823, left=20,top=20, resizable=yes,toolbar=no,scrollbars=yes");
}
function pam() {
var win;
win=window.open("pam.htm","images","height=600,width=823, left=20,top=20, resizable=yes,toolbar=no,scrollbars=yes");
}
function sixths() {
var win;
win=window.open("sixths.htm","images","height=600,width=823, left=20,top=20, resizable=yes,toolbar=no,scrollbars=yes");
}
//-->
</script></head>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tbody><tr>
    <td class="dunkel">[img]images/space.gif[/img]</td>
    <td style="width : 426pt;"><table border="0" cellpadding="0" cellspacing="0" width="426">
  <tbody>
  	<tr>
    	<td>[img]images/space.gif[/img]</td>
          <td>[img]images/header.jpg[/img]
          	<table cellpadding="0" cellspacing="0">
          		<tr>
          			<td>[img]images/menu_news.jpg[/img]</td>
          			<td>[img]images/menu_portfolio.jpg[/img]</td>
          			<td>[img]images/menu_ich.jpg[/img]</td>
          			<td>[img]images/menu_kontakt.jpg[/img]</td>
          			<td>[img]images/menu_leer.jpg[/img]</td>
          		</tr>
          	</table>
    </td>
          <td>[img]images/space.gif[/img]</td>
  </tr>
</tbody></table>
    </td>
    <td class="dunkel">[img]images/space.gif[/img]</td>
  </tr>
  <tr>
    <td class="weiß">[img]images/space.gif[/img]</td>
    <td class="weiß">[img]images/space.gif[/img]</td>
  </tr>
  <tr>
    <td class="rot">[img]images/space.gif[/img]</td>
    <td>
      <table border="0" cellpadding="0" cellspacing="0">
        <tbody><tr>
          <td> </td>
          <td style="width : 426pt;">

            [img]images/conthead_portfolio.jpg[/img]
            

            Eine kleine Auswahl. Nur Screen-/o. Pagedesign.

            <table border="0" cellpadding="0" cellspacing="4" width="100%">
              <tbody><tr> 
                <td style="width : 128pt;">[img]images/portec_mini.gif[/img]</td>
                <td valign="top"><a href="http://www.protecmedia.de/index_neu.php">ProTec 
                  media</a>

                  <span class="news_klein">Arbeitszeit: </span><span class="news_klein">9h

                  Aufgaben: Design/Maincoding/Scripts

                  

                  Luat enier sidtue an eienr elgnhcsien uvrsnäiett, ist es eagl in wcheler rhnfgeeloie die bstuchbaen in eniem wrot snid.</span> </td>
              </tr>
              <tr> 
                <td colspan="2"> 
                  <hr style="border : 1pt solid #000000; width : 100%; text-align : left;" />
                </td>
              </tr>
              <tr> 
                <td valign="top">[img]images/pam_mini.gif[/img]</td>
                <td><a href="http://www.printingandmore.de/">Printing and 
                  More</a>

                  <span class="news_klein">Arbeitszeit: </span><span class="news_klein">11h

                  Aufgaben: Design/Maincoding/Scripts

                  

                   das eniizg whictgie ist, dsas der etrse und der lztete bstuchbae am rtigeichn paltz snid. der rset knan tatol deiuranchnedr sien und man knan es ienrmomch onhe porbelm lseen.</span></td>
              </tr>
              <tr> 
                <td colspan="2"> 
                  <hr style="border : 1pt solid #000000; width : 100%; text-align : left;" />
                </td>
              </tr>

              <tr> 
                <td valign="top">[img]images/sixths-old_mini.gif[/img]</td>
                <td>Sixth Sense Design <span class="news_klein">(old)</span>

                  <span class="news_klein">Arbeitszeit: </span><span class="news_klein">&gt;3h

                  Aufgaben: Design

                  

                   das legit daarn, dsas wir nhcit jeedn bstuchbaen aeilln lseen, srednon das wrot als gzanes.</span></td>
              </tr>
            </tbody></table>
            

          </td>
<td> </td>
        </tr>
      </tbody></table>
      
    </td>
    <td class="rot"></td>
  </tr>  <tr>
    <td class="weiß">[img]images/space.gif[/img]</td>
    <td class="weiß">[img]images/space.gif[/img]</td>
  </tr>
  <tr>
    <td class="dunkel">[img]images/space.gif[/img]</td>
    <td>
      [img]images/bottom.jpg[/img]
    </td>
    <td class="dunkel">[img]images/space.gif[/img]</td>
  </tr>
</tbody></table>
</body></html>

paul123 · #2 (**permalink**) 28.09.2004, 13:02

Hallo Manuel.
Du scheinst da einiges zu verwechseln...

Zitat:

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

und

Zitat:

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr>
<td class="dunkel">[img]images/space.gif[/img]</td>
<td style="width : 426pt;"><table border="0" cellpadding="0" cellspacing="0" width="426">
<tbody>

passen nicht wirklich zusammen. In diesem Forum geht es um Auszeichung mit CSS - wo hast du die denn? Und vor allem, was steht denn da drin?

Du scheinst vieles mit Tabellen für dein layout zu definieren, das ist somit nicht richtig.

Tipp: haste das mal validieren lassen?
http://www.validome.org/lang/ge hier kannste das auch mit ner offlinesite testen.

whiskey · #3 (**permalink**) 28.09.2004, 13:06

ist aber alles komplett valid, laut W3 und dem validome...?!
Ich weiß, ich könnte alles in der CSS definieren, aber rein theoretisch an meinem problem ändert das doch nichts, oder?

paul123 · #4 (**permalink**) 28.09.2004, 13:14

Zitat:

<hr style="border : 1pt solid #000000; width : 100%;

wenn ich das sehe, schein in deiner css nicht viel drin zu stehen (was wiederum den Sinn einer externen Css anfragt).

Hm, zu deiner Frage kann ich mit meinem (leider) wenigen Wissen nicht kompetent antworten. Aber im Grunde nutzt du Techniken, die als veraltet gelten und nutzt die neuen Möglichkeiten der (späteren) Vereinfachung/Änderung durch CSS nicht.

Wenn das validiert, ist das ja gut. Aber auch nur die halbe Wahrheit. Hm, warte mal ab, bis hier die Vollprofis Ihre (durchaus kompetenten) und mit 1000en Links versehenen Beiträge bringen...

whiskey · #5 (**permalink**) 28.09.2004, 13:33

doch, das wird ja auch alles noch abgeändert..
ich frage mich nur, wie ich es hinbekomme, dass eben diese Lücken nicht mehr da sind

Ich ahbe sie jetzt kleiner bekommen, aber trotzdem gibt der FF immer noch weiße Lücken aus zwischen den Tabellen und Gott weiß wieso

paul123 · #6 (**permalink**) 28.09.2004, 13:40

Wenn da in der css was drin steht, pack es mal mit rein. Am besten du mast ne kleine Testseite mit einer Tabelle und ohne den ganzen Brimborium und nur das wichtigste, so das man das Problem sehen kann. CSS auch gleich dazu (im head)...

Dann wird das sicher geklärt.

whiskey · #7 (**permalink**) 28.09.2004, 14:21

gut, ich habe jetzt nur noch das kleine problem, dass mir zwischen zwei tabellen eine 2pixel dünne linie angezeigt wird, die im IE aber nicht ist.
folgender code (muss ja daran liegen?!):

Code:

<table border="0" cellpadding="0" cellspacing="0">
		  		  	<tr>
						<td colspan="5">[img]images/header.jpg[/img]</td></tr>
				    <tr>
          				<td>[img]images/menu_news.jpg[/img]</td>
          				<td>[img]images/menu_portfolio.jpg[/img]</td>
          				<td>[img]images/menu_ich.jpg[/img]</td>
          				<td>[img]images/menu_kontakt.jpg[/img]</td>
          				<td>[img]images/menu_leer.jpg[/img]</td>
          			</tr>
          	</table>

Das Wichtige ist wohl der Punkt, wo die neue tr anfängt...

dexter · #8 (**permalink**) 01.10.2004, 10:15

Grafiken drücken durch line-height dort (in die Zelle, nicht die "Reihe"!) einen Abstand rein. Abhilfe:
line-height runtersetzen
oder Grafiken als Blockelement setzen

Btw: pt ist keine Massangabe fürs Web! Auch nicht, wenn's auf null steht. (und bei Null kannste die Einheit eh auch gleich ganz weglassen.)

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Verschiebungen bei größerem Bildschirm	seelefant	CSS	4	28.07.2014 15:43
font-size - Verschiebungen im IE	kama	CSS	7	11.07.2013 17:01
verschiebungen bei direction rtl	cabotine	CSS	11	31.08.2008 17:21
keine VErschiebungen beim verkleinern vom Browserfenster!	sinot	CSS	9	21.04.2006 08:50
ie5 verschiebungen	Swoop	CSS	10	07.05.2005 00:11