Anzeige

[CS3] Probleme beim Slicen

[CS3] - Probleme beim Slicen | PSD-Tutorials.de

Erstellt von Gerk0rn, 05.08.2008.

  1. Gerk0rn

    Gerk0rn Noch nicht viel geschrieben

    Dabei seit:
    06.09.2006
    Beiträge:
    11
    Geschlecht:
    männlich
    Probleme beim Slicen
    Hallo.
    Ich hoffe ihr könnte mir weiterhelfen. Ich möchte folgendes Design slicen:

    [​IMG]

    Der weiße Content-Bereich soll nachher, um so mehr man schreibt/ Inhalt hat, mitlaufen.

    Kann mir da jemand weiterhelfen?!
     
    #1      
  2. Andy62

    Andy62 Aktives Mitglied

    Dabei seit:
    07.10.2007
    Beiträge:
    842
    Geschlecht:
    männlich
    Ort:
    Sondershausen/ Thüringen
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Hi,

    Das Slicen dient nicht zum Bildlauf, dafür ist eine Bildlaufleiste am rechten Rand des weißen Bereichs notwendig.

    Slicen dient der Unterteilung der aktuellen Seiten zum schnelleren Bildaufbau sowie bei größeren Grafiken zum schnelleren Laden. Das Bild wird einfach in kleinere Pics unterteilt und einzeln abgespeichert und beim Aufruf wieder zusammengesetzt.

    Gruß Andy62
     
    #2      
  3. cerialkiller

    cerialkiller Lord of the Board

    Dabei seit:
    03.07.2008
    Beiträge:
    103
    Geschlecht:
    männlich
    Software:
    Adobe Photoshop CS3
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Ja, in der Tat. Dein Problem liegt nicht beim Slicen, sondern am HTML-Code, bzw. am CSS.

    Wenn du dich mit CSS und HTML einigermasen auskennst, empfehle ich dir einfach ein "DIV" auf das weiße Feld zu legen und "overflow" auf "auto" bzw. "scroll" zu setzen. Dann wird dein "DIV" nicht vergrößert, sondern scrollt nach unten wenn es nötig ist.
     
    #3      
  4. Gerk0rn

    Gerk0rn Noch nicht viel geschrieben

    Dabei seit:
    06.09.2006
    Beiträge:
    11
    Geschlecht:
    männlich
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Hier mal mein Problem zu sehen:

    n-heaven.de

    Die Grafiken sollen sich an der Seite mitziehen ... Weiss nicht was ich falsch mache!
     
    #4      
  5. cerialkiller

    cerialkiller Lord of the Board

    Dabei seit:
    03.07.2008
    Beiträge:
    103
    Geschlecht:
    männlich
    Software:
    Adobe Photoshop CS3
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Also, ich vermute folgendes, nach kurzer Durchsicht der CSS und des Seitenqueltextes:

    Du hast zwar die Tabellen in einem "DIV" eingefügt, das "DIV" allerdings wird weder direkt noch über die CSS-Datei formatiert.
    Es fehlt soweit ich sehen kann, einfach die Angabe des "overflow".

    Mach einfach folgendes. Öffne die CSS und gib ein:

    Code (Text):
    1.  
    2. .maintable {
    3.                 overflow:auto;
    4.                }
    5.  
    Im eigentlichen HTML-Code gibst du dann an der Stelle wo das "DIV" aufgerufen wird folgendes ein:

    Code (Text):
    1.  
    2. <div id="maintable" align="center"> ...
    3.  
    Damit gibst du an, dass das "DIV" nicht vergrößert wird sobald was darüber hinausragt, sondern das es einen Scrollbalken einblendet und du den Text herunterscrollen kannst. Dabei bleibt die Größe des DIVs unverändert.
     
    #5      
  6. Gerk0rn

    Gerk0rn Noch nicht viel geschrieben

    Dabei seit:
    06.09.2006
    Beiträge:
    11
    Geschlecht:
    männlich
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Habe ich gemacht, klappt aber leider nicht...

    Kann ich dir vielleicht die .css und die index.php mal zukommen lassen und du guckst dir das nochmal genauer an?!

    Wäre nett.

    Danke
     
    #6      
  7. cerialkiller

    cerialkiller Lord of the Board

    Dabei seit:
    03.07.2008
    Beiträge:
    103
    Geschlecht:
    männlich
    Software:
    Adobe Photoshop CS3
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Jo, ich kann ja mal nen Blick reinwerfen.

    Wobei ich gerade meinen Fehler gesehen habe.
    Mach anstatt dem "." vor dem "maintable", einfach das "#" Zeichen.

    Code (Text):
    1.  
    2. #maintable {overflow:auto; height:250px; widht:250px; background-color:none;}
    3.  
    So müsste es gehen. Das mit dem Punkt bezeichnet eine "class", die Raute eine "id".^^
    Kleiner aber feiner unterschied, sry :D

    Ich hab dir hierzu ein Beispiel erstellt:
    Beispiel

    Der Quelltext hierzu in der HTML
    Code (Text):
    1.  
    2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    3. <html>
    4.     <head>
    5.         <title>Beispiel</title>
    6.         <link rel="stylesheet" type="text/css" href="bsp.css">
    7.     </head>
    8.     <body>
    9.         <div id="maintable">
    10.             <table border="1" bgcolor="orange">
    11.                 <tr><td>
    12.                     Dies ist eine Beispieldatei.<br>
    13.                     Dies ist eine Beispieldatei.<br>
    14.                     Dies ist eine Beispieldatei.<br>
    15.                     Dies ist eine Beispieldatei.<br>
    16.                     Dies ist eine Beispieldatei.<br>
    17.                     Dies ist eine Beispieldatei.<br>
    18.                     Dies ist eine Beispieldatei.<br>
    19.                     Dies ist eine Beispieldatei.<br>
    20.                     Dies ist eine Beispieldatei.<br>
    21.                     Dies ist eine Beispieldatei.<br>
    22.                     Dies ist eine Beispieldatei.<br>
    23.                     Dies ist eine Beispieldatei.<br>
    24.                     Dies ist eine Beispieldatei.<br>
    25.                     Dies ist eine Beispieldatei.<br>
    26.                     Dies ist eine Beispieldatei.<br>
    27.                     Dies ist eine Beispieldatei.<br>
    28.                     Dies ist eine Beispieldatei.<br>
    29.                     Dies ist eine Beispieldatei.<br>
    30.                     Dies ist eine Beispieldatei.<br>
    31.                     Dies ist eine Beispieldatei.<br>
    32.                     Dies ist eine Beispieldatei.<br>
    33.                     Dies ist eine Beispieldatei.<br>
    34.                     Dies ist eine Beispieldatei.<br>
    35.                     Dies ist eine Beispieldatei.<br>
    36.                     Dies ist eine Beispieldatei.<br>
    37.                     Dies ist eine Beispieldatei.<br>
    38.                     Dies ist eine Beispieldatei.<br>
    39.                     Dies ist eine Beispieldatei.<br>
    40.                     Dies ist eine Beispieldatei.<br>
    41.                     Dies ist eine Beispieldatei.<br>
    42.                     Dies ist eine Beispieldatei.<br>
    43.                 </td></tr>
    44.             </table>
    45.         </div>
    46.     </body>
    47. </html>
    48.  
    und die CSS

    Code (Text):
    1.  
    2. #maintable {overflow:auto; height:50px; width:200px; background-color:green;}
    3.  
     
    Zuletzt bearbeitet: 07.08.2008
    #7      
  8. Gerk0rn

    Gerk0rn Noch nicht viel geschrieben

    Dabei seit:
    06.09.2006
    Beiträge:
    11
    Geschlecht:
    männlich
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Super!
    Danke für die Hilfe... Hat jetzt alles super geklappt!
     
    #8      
  9. indesignout

    indesignout Noch nicht viel geschrieben

    Dabei seit:
    30.05.2008
    Beiträge:
    18
    Geschlecht:
    männlich
    Probleme beim Slicen
    AW: Probleme beim Slicen

    wo kann man das resultat sehen, würde mich echt interessieren ? thx
     
    #9      
  10. cerialkiller

    cerialkiller Lord of the Board

    Dabei seit:
    03.07.2008
    Beiträge:
    103
    Geschlecht:
    männlich
    Software:
    Adobe Photoshop CS3
    Probleme beim Slicen
    AW: Probleme beim Slicen

    Link steht weiter oben.
    Ich habs gesehen. Schaut gut aus.^^
     
    #10      
x
×
×