zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Unerklärliche Lücke über DIV

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 11.04.2012, 18:28
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.01.2012
Ort: Thüringen
Beiträge: 10
Tony-S befindet sich auf einem aufstrebenden Ast
Standard Unerklärliche Lücke über DIV

Hallo Forum,

ich versuche gerade herauszufinden, warum auf einer meiner Seiten eine Lücke über einem DIV ist, die dort nicht hingehört, dieses und kein anderes Element haben ein margin oder padding. Es macht auch kaum einen Unterschied in welchem Browser ich es ausführe, in Chromium, Opera, FF11 und dem IE9 tritt diese Lücke auf im FF5 noch nicht.

gemeint ist der markierte Bereich:



Wie dort zu sehen ist, handelt es sich um ein PHP Dokument aber da ich ja HTML ausgeben, denke ich hier noch richtig zu sein.

Der Quellcode der Seite ist quasi dieser hier:
HTML-Code:
<!DOCTYPE html>
       <html lang="de">
         <head>
           <title>Kabelliste</title>
           <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
           <link rel="stylesheet" type="text/css" href="./netzwerkprojekt/styles/reset.css" />
           <link rel="stylesheet" type="text/css" href="./netzwerkprojekt/styles/table.css" />
           <link rel="stylesheet" type="text/css" href="./netzwerkprojekt/styles/style.css" />
           <link rel="stylesheet" type="text/css" href="./netzwerkprojekt/styles/404.css" />

         </head>

         <body>
          <div id="leitungs-box">
            <p class="leitungsnummer">Leitungsnummer: 5</p>
          </div>

          <div id="count-box">18 Einträge gefunden :)</div><br />
          <table width="100%">

            <colgroup>
              <col width="10%">
              <col width="10%">
              <col width="40%">
              <col width="40%">
            </colgroup>

            <tr>
              <th>Start-DS</th>
              <th>Ziel-DS</th>
              <th>Geräte</th>
              <th>Port</th>
            </tr>

            <tr class="white" id="36"><td>2</td>
              <td>2</td>
              <td>PP 9</td>
              <td>P23</td>
            </tr>
         
        </table></body>

      </html>
Das einzig merkwüridge was ich im DOM-Inspektor vom Chromium sehe, ist das hier:




Hier noch die zwei CSS-Dateien die es betreffen kann:

reset.css:
Code:
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline; }
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block; }
  body {
    line-height: 1; }
  ol, ul {
    list-style: none; }
  blockquote, q {
    quotes: none; }
  blockquote:before, blockquote:after,
  q:before, q:after {
    content: '';
    content: none; }
  table {
    border-collapse: collapse;
    border-spacing: 0; }
und style.css

Code:
body {
  line-height: 1;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  background-color: rgb(223, 223, 223);
}

body, html, p {
  margin: 0; 
}

body, html  {
  height: 100%;
}

  .leitungsnummer {
    padding: 10px 0 10px 0;
    font-size: 48px;
    color: white;
  }
  
  .counter {
    font-size: 12px;
    color: white;
  }

#leitungs-box {
  width: 100%;
  padding: 0 0 10px 0;
  
  text-align: center;
  
  background-color: rgb(128, 128, 128);
}

#count-box {
  width: 100%;
  padding: 10px 0 10px 0;
  
  text-align: center;
}
Ich kann beim besten Willen nirgends etwas finden was diese Lücke auslösen könnte, habt ihr eine Idee was das sein kann?

Geändert von Tony-S (12.04.2012 um 23:44 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 11.04.2012, 18:32
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

bitte einen Link zur Seite posten. Zip-Dateien lädt sich kaum einer runter. Wenn die Seite nicht Online ist: Google nach Freehoster (meine Empfehlung: bplaced.net).

gruß,
take
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 11.04.2012, 18:48
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Zitat:
Zitat von Tony-S Beitrag anzeigen
hm wenn ich es ohne jegliches PHP öffne, isses korrekt, ich hab quasi nur die php Ausgabe jetzt kopiert... dann weiß ich auch nicht weiter
Dann untersuche deinen PHP-Code, wo ggfs. eine unerwünschte Ausgabe stattfindet.

Folgendes noch als Hinweis:
Deine Datei ist ISO-Kodiert und nicht, wie du angibst, in UTF-8.

Speichere deine Datei UTF-8 kodiert (ohne BOM) ab (das sollte in jedem Editor problemlos möglich sein).

Zudem solltest du die Meta-Angabe zur Zeichenkodierung vor das title-Element stellen (dieses könnte je bereits kodierte Zeichen enthalten).
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
  #4 (permalink)  
Alt 11.04.2012, 21:04
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

mit diesem Script kann man ebensowenig tun. Ich werde jetzt bestimmt nicht versuchen, dass irgendwie auf meinem lokalen Server ans Laufen zu bekommen, geschweige denn es im Kopf zu parsen.

Was ich dir aber sagen kann ist: Dein Script hat eine Sicherheitslücke der Größe von 3-4 Scheunentoren (SQL-Injection, Cross-Site-Scripting). Informiere dich mal hier im SELFHTML-Wiki, wie man sowas vermeidet.

gruß,
take
Mit Zitat antworten
  #5 (permalink)  
Alt 11.04.2012, 21:46
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.016
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Die Leerzeichen stammen von hier:
PHP-Code:
    echo '
      <!DOCTYPE html>

…' 
Das dürfte aber keine Lücke zur Folge haben und hat es bei deinem Testcase auch nicht, wobei da auch keine Leerzeichen am Anfang deines Codes zu finden sind.

HTML in einen String zu stopfen ist auch keine besonders gute Lösung. PHP ist gut geeignet um in HTML eingebettet zu werden, umgekehrt gilt das nicht unbedingt.

Ohne das Problem live zu sehen können wir nur schlecht bis gar nicht weiterhelfen.
Mit Zitat antworten
  #6 (permalink)  
Alt 12.04.2012, 14:42
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.01.2012
Ort: Thüringen
Beiträge: 10
Tony-S befindet sich auf einem aufstrebenden Ast
Standard

Ich habe es jetzt anders und zwar mit absoluten Angaben gelöst.
Also count-box und leitungs-box auf position: absolute; und top so das es passt.

Geändert von Tony-S (12.04.2012 um 23:48 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 12.04.2012, 17:38
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Zitat:
Zitat von Tony-S Beitrag anzeigen
Ich habe es jetzt anders und zwar mit absoluten Angaben gelöst.
Also count-box und leitungs-box auf position: absolute; und top so das es passt.
Absolute Positionierung ist fast immer ein Problem mehr anstatt ein Problem weniger.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Antwort


Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 19:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 16:53
Header entfernen tripple CSS 17 15.06.2010 15:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 10:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 19:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 06:43 Uhr.