blogeum
 

Textumfluss auf moderne Weise abbrechen

Jedem Webworker ist sicher schon einmal folgendes Problem untergekommen:

Clearing-Problem

Da ich immer wieder eine recht rustikale Lösung des Problems sehe, möchte ich einmal auf eine viel trickreichere und schönere hinweisen.

Das Problem

Zwei Boxen (DIV) sollen nebeneinander innerhalb einer weiteren Box positioniert und darum einen Rahmen oder eine Hintergrundfarbe gesetzt werden. Das CSS-Box-Model (bzw. dessen Auslegung) verhindert nun aber, dass die umgebende Box so weit erweitert wird, sodass beide DIVs umfasst werden. Hierzu sei folgender HTML-Quelltext gegeben:

<!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" lang="de">
    <head>
        <title>Textumfluss-Problem</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">

        <style type="text/css">
            body {background-color: #FFF; font: 62.5%/1.8em Arial, Helvetica, Sans-Serif;}

            #wrap {border: #F08080 5px solid; margin: 0 auto; padding: 5px; width: 500px;}

            #wrap p {font-size: 1.2em; margin: 5px; width: 48%;}
            #wrap p#one {background: #B0C4DE; float: left;}
            #wrap p#two {background: #B0C4DE; float: right;}
        </style>
    </head>

    <body>

        <div id="wrap">
            <p id="one">Er hörte leise Schritte hinter sich. Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel beleumundeten Hafenviertel? Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Hatte einer seiner zahllosen Kollegen dieselbe Idee gehabt, ihn beobachtet und abgewartet, um ihn nun um die Früchte seiner Arbeit zu erleichtern? Oder gehörten die Schritte hinter ihm zu einem der unzähligen Gesetzeshüter dieser Stadt, und die stählerne Acht um seine Handgelenke würde gleich zuschnappen?</p>
            <p id="two">Er konnte die Aufforderung stehen zu bleiben schon hören. Gehetzt sah er sich um. Plötzlich erblickte er den schmalen Durchgang. Blitzartig drehte er sich nach rechts und verschwand zwischen den beiden Gebäuden. Beinahe wäre er dabei über den umgestürzten Mülleimer gefallen, der mitten im Weg lag. Er versuchte, sich in der Dunkelheit seinen Weg zu ertasten und erstarrte: Anscheinend gab es keinen anderen Ausweg aus diesem kleinen Hof als den Durchgang, durch den er gekommen war. Die Schritte wurden lauter und lauter, er sah eine dunkle Gestalt um die Ecke biegen. Fieberhaft irrten seine Augen durch die nächtliche Dunkelheit und suchten einen Ausweg.</p>
        </div>

    </body>
</html>

Typischerweise würde man dieses Problem lösen, indem man der äußeren Box #wrap auch ein float-Attribut mitgibt und so einen Textumfluss erzwingt.
Nun muss jedoch der Umfluss direkt nach der Box wieder abgebrochen werden, weil sonst die nachfolgenden Elemente die Box umfließen würden.
<br style="clear: both;" /> und Konsorten werden hierfür typischerweise hergenommen. Dummerweise blähen sie den Quelltext unnötig auf und erschweren die Wartbarkeit. Ein unschöner Notbehelf also.

Ein neuer Ansatz

Wie löst man also heutzutage dieses Problem? Der Schlüssel zur Lösung liegt im CSS-Attribut overflow und dessen Eigenschaft hidden. Danke an Dave Shea und SitePoint für den Tipp.

#wrap {overflow: hidden; border: #F08080 5px solid; margin: 0 auto; padding: 5px; width: 500px;}

Angewendet auf die äußere Box #wrap führt dies auf geradezu magische Art und Weise dazu, dass die äußere Box die beiden inneren nun vollständig umfasst.

Problemlösung mit Overflow

Der Nachteil

Wie jede andere Methode zur Lösung dieses speziellen Problems hat auch diese ihren Nachteil. Werden die beiden inneren Boxen im Beispiel zu breit, werden sie wegen der hidden-Eigenschaft einfach abgeschnitten. Man sollte also genau darauf achten, den Inhalt nicht zu breit werden zu lassen.
Im folgenden Bild wurde zur Verdeutlichung das hidden durch auto ersetzt, wodurch dann horizontale Scrollbalken auftreten anstatt dass der Inhalt abgeschnitten wird.

Nachteil der Lösung

Alles in allem halte ich dies für eine schöne und saubere Lösung, die in sehr vielen Browsern einwandfrei funktioniert.

Fachbücher kostenfrei lesen

Der Dienst PaperC ermöglicht das kostenfreie Lesen von derzeit knapp 2900 Fachbüchern aus den unterschiedlichsten Bereichen. Dafür konnte der Anbieter über 25 namhafte Verlage wie O'Reilly, Addison-Wesley und Pearson als auch den deutschen Markt+Technik Verlag gewinnen. Demnach sind viele englisch- und deutschsprachige Bücher zu haben.
Nach der Anmeldung kann man die Bücher dann kostenlos über eine Web-Oberfläche lesen. Über eine Suchfunktion kann man Bücher nach verschiedenen Kriterien suchen (ISBN, Autor, Titel, etc.).

PaperC

Im Rahmen der kostenfreien Nutzung kann (und darf) man die Bücher jedoch nicht abspeichern sondern nur online lesen. Wenn man Gefallen gefunden hat, kann man das Buch direkt bei Amazon kaufen oder als PDF herunterladen, Texte kopieren, ausdrucken und eigene Anmerkungen erstellen. Hierfür verlangt PaperC 0,10 € pro PDF-Seite. Das Erstellen von Screenshots ist gemäß den AGB ausdrücklich verboten.

Gerade für die ewig klammen Studenten ein echter Spartipp, weil Fachbücher meist relativ kostspielig sind.

[via Bjoerns Windows Blog]

Standardsuchanbieter in Firefox ändern

Die Adressleiste (location bar) ist in Mozilla Firefox 3 intelligenter geworden. Sie erlaubt die gleichzeitige Suche in den Lesezeichen und dem Browserverlauf der besuchten Seiten. Falls ein Text eingegeben wird, der keine gültige URL darstellt, versucht Firefox diesen Text per Google zu finden. Hierbei wird die „Auf gut Glück“-Suche („I'm Feeling Lucky“) genutzt, die dann automatisch auf das erstbeste Suchergebnis weiterleitet.

Adressleiste von Firefox

Wer sich – speziell aus Datenschutzgründen – von Google lossagen und stattdessen eine andere Suchmaschine mit dieser Arbeit betrauen möchte, kann den eingebauten Standardsuchanbieter jedoch manuell ändern.

  1. Im Adressfeld about:config eingeben
  2. Die Meldung „Hier endet möglicherweise die Gewährleistung!“ mit einem Klick auf „Ich werde vorsichtig sein, versprochen!“ bestätigen
  3. Im Feld „Filter“ nach dem Begriff keyword.url suchen.
  4. Per Doppelklick auf den gefundenen Begriff kann der Wert geändert werden.

Im Folgenden sind einige Suchmaschinen aufgelistet, die sich als Alternative zur Google-Suche gut eignen. Einfach den Wert in der Spalte URL des gewünschten Anbieters übernehmen.

AnbieterURL
Ask.com Deutschlandhttp://de.ask.com/web?q=
Deutsche Wikipediahttp://de.wikipedia.org/wiki/Spezial:Suche?search=
Ixquick Metasuchehttp://www.ixquick.com/do/metasearch.pl?language=deutsch&query=
Microsoft Binghttp://www.bing.com/search?q=
Wolfram|Alphahttp://www.wolframalpha.com/input/?i=
Yahoo! Deutschland Suchehttp://de.search.yahoo.com/search?p=

Wer noch einen guten Suchanbieter beisteuern möchte, kann dies gerne in einem Kommentar tun. Ich werde die Liste dann entsprechend ergänzen.

Ich persönlich bevorzuge die Suche von Bing, weil sie sich langsam aber sicher zu einer echten Konkurrenz zum Branchenprimus Google gemausert hat.

Nach einem Neustart von Firefox wird von nun an der alternative Suchanbieter zur Suche genutzt, wenn ein beliebiger Text in die Adressleiste eingegeben wird (s.o.).

Verfassungsgericht stoppt Vorratsdatenspeicherung

Das Bundesverfassungsgericht (BVerfG) hat heute das umstrittene „Gesetz zur Neuregelung der Telekommunikationsüberwachung“ – kurz Vorratsdatenspeicherung – für nichtig erklärt. Demnach sei es in seiner jetzigen Form nicht mit dem Grundgesetz, speziell Art. 10 Abs. 1 GG (Fernmeldegeheimnis), vereinbar.

Seit 2008 waren Telekommunikationsanbieter gezwungen Verbindungsdaten von Internet-, Telefon- und Handynutzern für 6 Monate auf Vorrat zu speichern. Dies geschah im Hinblick auf die Verfolgung von Straftaten sowie der Gefahrenabwehr.

Bei dem Gesetz handelt es sich um die Umsetzung einer EU-Richtlinie, die, nach Ansicht der Richter, jedoch nicht generell gegen Grundrechte verstoße:

Der Inhalt der Richtlinie belässt der Bundesrepublik Deutschland einen weiten Entscheidungsspielraum. Ihre Regelungen sind im Wesentlichen auf die Speicherungspflicht und deren Umfang beschränkt […]. Mit diesem Inhalt kann die Richtlinie ohne Verstoß gegen die Grundrechte des Grundgesetzes umgesetzt werden. Das Grundgesetz verbietet eine solche Speicherung nicht unter allen Umständen. Pressemitteilung des BVerfG

Dadurch ist der Gesetzgeber nun gezwungen das Gesetz einer Revision zu unterziehen und es so mit dem Grundgesetz in Einklang zu bringen. Denn es handele sich bei der Speicherung um „einen besonders schweren Eingriff mit einer Streubreite, wie sie die Rechtsordnung bisher nicht kennt“.

Wie die Verfassungsrichter zudem bemerkten, ließen sich durch die gespeicherten Daten inhaltliche Rückschlüsse ziehen – auch wenn die Inhalte selber nicht gespeichert würden – die bis in die Intimsphäre hineinreichten.

Weiterhin sei die „Rekonstruktion gerade der Telekommunikationsverbindungen […] für eine effektive Strafverfolgung und Gefahrenabwehr von besonderer Bedeutung“. Die „anlasslose Speicherung der Telekommunikationsverkehrsdaten“ müsse dennoch eine Ausnahme bleiben, um verfassungsrechtlich unbedenklich zu bleiben.

Hierbei handelt es sich aber nicht um ein generelles Votum gegen die Vorratsdatenspeicherung, da sie „eingebunden in eine dem Eingriff adäquate gesetzliche Ausgestaltung“ durchaus rechtsmäßig sei. Demnach sollten die Daten zunächst von den TK-Anbietern selber gespeichert werden und nicht zusammengeführt werden, sodass der Staat keinen direkten Zugriff auf die gesamten Daten hat.

[Quelle: Pressemitteilung des BVerfG]

Danke für die Hinweise an Basic Thinking und sjmp.de.

Firefox anonymer machen

Spätestens seitdem bekannt ist, dass man allerhand Daten über den Browser ohne Probleme auslesen kann – angefangen bei besuchten Seiten, installierten Plugins, installierten Schriften, etc. – sind einige Benutzer beunruhigt. Lassen sich doch damit eindeutige Benutzerprofile ohne Zutun des Benutzers erstellen. Projekte wie Panopticlick der EFF oder der Anonymitätstest von JAP machen es vor und zeigen einige der gelieferten Informationen an, quasi ein Fingerabdruck des Browsers.

Panopticlick

Dabei kann man mit ein paar einfachen Schritten Firefox ein wenig Anonymität beibringen. Hierbei muss man allerdings „unter der Haube“ rumschrauben, da Firefox hierfür keinen Einstellungsdialog bietet.

  1. Im Adressfeld about:config eingeben
  2. Die Meldung „Hier endet möglicherweise die Gewährleistung!“ mit einem Klick auf „Ich werde vorsichtig sein, versprochen!“ bestätigen
  3. Im Feld „Filter“ nach den folgenden Begriffen suchen. Falls kein Ergebnis angezeigt wird, den Wert einfach anlegen. Dazu rechtsklicken und Neu > [Typ] wählen.

    Anlegen eines neuen Wertes

Folgende Werte sollten angelegt oder geändert werden:

NameTypempfohlener Wert
general.useragent.overrideStringMozilla/5.0 (en-US; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2
intl.accept_languagesStringen
intl.accept_charsetsStringutf-8,*
network.http.accept.defaultString*/*
network.http.sendRefererHeaderInteger1

general.useragent.override sorgt dafür, dass sich der Browser nicht mehr so auskunftsfreudig zeigt und nur eine „neutrale“ Identifikation sendet.

intl.accept_languages teilt dem angefragten Server mit, dass die vom Client akzeptierte Sprache nur Englisch ist. Dadurch wird bei den meisten Web-Anwendungen die automatische Einstellung der Sprache verhindert (HTTP_ACCEPT_LANGUAGES Headerfeld).

intl.accept_charsets bestimmt, welche Zeichensätze vom Browser akzeptiert weden. Vorrangig also UTF-8. Derzeit wohl nicht mehr verwendet!

network.http.accept.default teilt dem angefragten Server mit, welche MIME-Typen (quasi Dateitypen) der Browser akzeptieren will bzw. kann.

Schließlich legt network.http.sendRefererHeader fest, wann ein Referrer (zuvor besuchte Seite) an den Server gesendet wird. Diese Einstellung ist durchaus wichtig, weil sich einige Web-Anwendungen darauf verlassen.
0 schaltet die Funktion ganz ab. Dies ist zwar sicher, weil kein Referrer mehr gesendet wird, hat aber den eben erwähnten Nachteil. Bei 1 sendet der Browser den Referrer nur noch beim Klick auf einen Link. Der Standardwert 2 sendet den Referrer zusätzlich auch an den Server, wenn eingebettete Bilder aufgerufen werden.

JonDo

Mit diesen Einstellungen kann man Firefox zwar keine vollständige Anonymität beibringen – diese gibt es im Internet schlicht nicht – aber die Auskunftsfreudigkeit zumindest ein wenig einschränken. Noch sicherer wird es, wann man Java und JavaScript deaktiviert, allerdings büßt man damit aber auch Komfort ein und Web 2.0 Anwendungen sind damit nicht nutzbar.

Was’n das?

blogeum ist das persönliche Weblog von Christian Gürtler – seines Zeichens begeisterter Webworker und Programmierer. Er studiert gegenwärtig Angewandte Informatik an der TU Chemnitz.

 

Abonnieren

RSS-IconImmer auf dem Laufenden mit den Einträgen aus dem Weblog als Atom-Feed. Nunmehr 72 Abonnenten!

Folge mir auf Twitter

 

Neue Kommentare

Christian: Hallo, interessante Funktion. Ich denke ich werde das Beispiel für JavaScript…

Tobias Neumann: Hallo, interessante Funktion. Ich denke ich werde das Beispiel für JavaScript…

Christian: OK, den Zugriff auf "superglobale" Objekte wie window habe ich nicht bedacht.…

ChrisB: Auf diese Weise haben wir auch JSON geparsed, aber ohne Sicherheitsbedenken.…

Martha: Das wundert mich auch. Rot ist doch eine Warnfarbe. Ich kann mir das auch nur…

 

Neue Einträge

 

Lesenswert

Werbung

Wikio - Top Blog - High-tech

 

© 2009–2010 Christian Gürtler

Die Blog-Inhalte stehen unter einer Creative Commons-Lizenz.

XHTML · CSS

BlogPingR.de - Blog Ping-Dienst, Blogmonitor Blogverzeichnis - Blog Verzeichnis bloggerei.de