CSS/Perl Umbruchkontrolle von Bernhard Heuvel, 03.05.2006 15:01

CSS/Perl Umbruchkontrolle

Bernhard Heuvel 03.05.2006 15:01

Hallo an alle,

das Umbruchproblem meines letzten Beitrages konnte ich lösen. Allerdings kam jetzt in einer anderen Box was völlig anderes raus. Ich komm einfach nicht dahinter und wäre dankbar für ein weiteres prüfendes Auge ;o)

#======================================================================
Hier mal ein Screenshot von der Seite:

http://home.arcor.de/bernhard_downunder/textumbruch.png

Wie man sieht wird der Text in einer schmalen Spalte gehalten. Es sei denn, das Wort ist sehr lang - dann wird die Spalte überragt. Vielleicht liegt es an den zwei Knöppen rechts oben im Beitrag...

#======================================================================
Hier die CSS-Datei:

body {
    color: black; background-color: white;
    font-size: 100.01%;
    font-family: Helvetica,Arial,sans-serif;
    margin: 0; padding: 1em;
    min-width: 41em; /* Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern */
  }

h1 {
    display:block;
    font-size: 2em;
    margin: 0 0 0.7em; padding: 0.3em;
    text-align: center;
    background-color: lightblue;
    background-image: url(fox.gif);
    background-repeat: no-repeat;
    background-position: right;
    border: 2px ridge silver;
  }

h1:hover { background-image:url(foxyylupe.gif); }

html>body h1 {
border-color: gray; /* Farbangleichung an den Internet Explorer */
}

ul#Navigation {
    font-size: 0.83em;
    float: left; width: 18em;
    margin: 0 0 1.2em; padding: 0;
    border: 1px dashed silver;
  }
  ul#Navigation li {
    list-style: none;
    margin: 0; padding: 0.5em;
  }
  ul#Navigation a {
    display: block;
    padding: 0.2em;
    font-weight: bold;
  }
  ul#Navigation a:link {
    color: black; background-color: #eee;
  }
  ul#Navigation a:visited {
    color: black; background-color: #eee;
  }
  ul#Navigation a:hover {
    color: black;
    background-color: white;
    background-image: url(foxyeyes.gif);
    background-repeat: no-repeat;
    background-position:right;
  }
  ul#Navigation a:active {
    color: white; background-color: gray;
  }

div#Info {
    font-size: 0.9em;
    float: right; width: 12em;
    margin: 0 0 1.1em; padding: 0;
    background-color: #eee; border: 1px dashed silver;
  }

div#Info h2 {
    font-size: 1.33em;
    margin: 0.2em 0.5em;
  }
  div#Info p {

}

div#Info ol {
  list-style-type:circle;
  list-style-position: outside;
  font-size: 1em;
  }

div#Info a:link {color:black; text-decoration:none;}
  div#Info a:visited { color:silver; text-decoration:none;}
  div#Info a:focus { color:red; text-decoration:underline;}
  div#Info a:hover { color:red; text-decoration:underline;}
  div#Info a:active { color:lime; text-decoration:underline;}

div#Inhalt {
    margin: 0 12em 1em 16em;
    padding: 0 1em;
    border: 1px dashed silver;
  }
  * html div#Inhalt {
    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
  }
  div#Inhalt h2 {
    font-size: 1.2em;
    margin: 0.2em 0;
  }
  div#Inhalt p {
    text-align: justify;
    font-size: 0.9em;
    margin: 1em 0;
  }

div#Inhalt a:link {color: #000080; font-weight: bold;}

div#Inhalt form { float: right; position: relative; margin-top:1px; margin-right:1px; }

p#Fusszeile {
    clear: both;
    font-size: 0.9em;
    margin: 0; padding: 0.1em;
    text-align: center;
    background-color: lightblue; border: 1px solid silver;
  }

div#Edit {
    margin: 0 1em 1em 16em;
    padding: 0 1em;
    border: 1px dashed silver;
  }
  * html div#Edit {
    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
  }
  div#Edit h2 {
    font-size: 1.2em;
    margin: 0.2em 0;
  }
  div#Edit p {
    text-align: justify;
    font-size: 0.9em;
    margin: 1em 0;
  }

form { padding:5px; }
  td, input, select, textarea {font-size:13px;}
   .Bereich, .Feld { background-color:#ffa; width:500px; border:1px solid #ddd; }
   .Bereich2, .Feld2 { background-color:#ffa; border:1px solid #ddd; border-top-color: red; white-space:pre;}
   .Bereich3, .Feld3 { background-color:#ffa; border:1px solid #ddd; border-top-color: green; }
   .Auswahl { background-color:#dff; width:300px; border:1px solid #ddd; color:#00c;}
   .Check, .Radio { background-color:#ddff; border:1px solid #ddd; }
   .Button { background-color:#aaa; color:#fff; width:200px; border:6px solid #ddd; }

#======================================================================
Hier das Perlskript (Achtung: Augenkrebs...):

print "Content-Type: text/html; charset=iso-8859-15\n\n";

print << "eof";
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
  <title></title>
    <link rel="stylesheet" type="text/css" href="/Wikiformate.css">
  </head>
<body>

<FORM action="/cgi-bin/FBSERVER/suche.pl" method="post" enctype="multipart/form-data">
<h1>KosyWiki
   <input type="text" size="20" maxlength="50" name="suchsuch" value="Suchwort">
   <input type="submit" value="Suchen"></FORM>
  </h1>

<ul id="Navigation">
    <li><a href="/cgi-bin/some.pl">Kosy</a>
     <ul>
      <li><a href="/cgi-bin/some.pl">Kosy-KK</a></li>
         <li><a href="/cgi-bin/some.pl">Kosy-IL</a></li>
    <li><a href="/cgi-bin/some.pl">Kosy-DP</a></li>
    <li><a href="/cgi-bin/some.pl">Kosy-KT</a></li>
    <li><a href="/cgi-bin/some.pl">Kosy-KS</a></li>
    <li><a href="/cgi-bin/some.pl">Kosy-NN</a></li>
     </li></ul>
    <li><a href="/cgi-bin/some.pl">HappyHour</a></li>
  </ul>

<h2>Neue Artikel</h2>
    <ol>
eof
    my $aref = $dbh->selectall_arrayref("SQL-Anweisung")
      or die $dbh->errstr();
    $i=0;
    for my $go (@$aref){
        my ($news) = @$go;
           if ($i < 2){
             print '<li><a href="#' . $news . '">';

my $sth = $dbh->prepare ('select TITLE blah') or die $dbh->errstr;
$sth->execute($news) or die $sth->errstr;

my ($tit) = $sth->fetchrow_array();

print $tit . '</a></li><br>';
             $i++;
      }
     }

print << "eof";
</ol>
</div>

<div id="Inhalt">
  <h2><a name="">Überschrift</a></h2>
  <FORM action="/cgi-bin/some.pl" method="post" enctype="multipart/form-data" style="text-align:right">
   <input type="hidden" value="KosyKK">
   <input type="image" src="/edit2.gif"></FORM>
    <p></p>
eof

my $aref = $dbh->selectall_arrayref("SQL");

for my $query (@$aref){
my ($WREF) = @$query;

my $aref = $dbh->selectall_arrayref("SQL") or die $dbh->errstr();

for my $los (@$aref){ my ($ID,$INSERTDATE,$INSERTUREF,$TITLE,$MEMO) = @$los;
      print '<fieldset class="Bereich2"><legend><b>';
      print '<a name="' . $ID . '">';
      printf "$ID.) $TITLE";
      print '</a></b></legend><form action="/cgi-bin/some.pl" method="post" style="text-align:right"><input type="hidden" name="eintrag"';
      print ' value="' . $ID . '"><input type="image" src="/kill.gif"></form>';

print '<form action="/cgi-bin/some.pl" method="post" style="text-align:right"><input type="hidden" name="eintrag"';
print ' value="' . $ID . '"><input type="image" src="/edit.gif"></form>';

print "<p>$MEMO" . '<br><br>';

if ($PICTURE1NAME ne ''){
        print '<a href="/'. $PICTURE1NAME . '" target="new">BILD</a><br>';
                       } else {print '<br>';}
      if ($FILENAME ne ''){
        print '<a href="/' . $FILENAME . '" target="new" align="right">DATEI</a><br><br>';
            }  else {print '<br>';}

my $sth = $dbh->prepare ('SQL') or die "Verbindung fehlgeschlagen:" . $dbh->errstr;
$sth->execute($INSERTUREF) or die "Aufruf fehlgeschlagen!:" . $sth->errstr;
my ($user) = $sth->fetchrow_array();

print "<b>$user ($INSERTDATE)</b>";
print '</p></fieldset> <br>';
}

print << "eof";
</div>

</body>
</html>
eof

#===================================================================

Danke im voraus!

Bernhard Heuvel

Beitrag melden

– Informationen zu den Bewertungsregeln

SELFHTML Forum - Ergänzung zur Dokumentation Übersicht

Bernhard Heuvel: CSS/Perl Umbruchkontrolle

Beitrag lesen

CSS/Perl Umbruchkontrolle

CSS/Perl Umbruchkontrolle