Ergebnis 1 bis 3 von 3

Thema: faux columns

  1. #1
    Forum Guru
    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard faux columns

    Hi habe in einem anderen Thread was von faux columns gelesen.

    Ist an sich wirklich praktisch, aber ist es auch möglich das auf dieses Beispiel an zu wenden und zwar so, das die Positionierung der Elemente im Quelltext gleich bleibt, also content zu oberst..

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>test</title>
    <style type="text/css">
    .content &#123;
    	position&#58;absolute;
    	top&#58; 10px;
    	left&#58; 300px;
    	width&#58; 600px;
    	background-color&#58; #FFFFCC;
    	border&#58; 1px solid #000000;
    	line-height&#58; 40px;
    &#125;
    
    .menu &#123;
    	position&#58;absolute;
    	top&#58; 10px;
    	left&#58; 80px;
    	width&#58; 200px;
    	background-color&#58; #FFCC33;
    	border&#58; 1px solid #000000;
    &#125;
    </style>
    </head>
    
    <body>
    <div class="content">
    
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    
    c</p>c
    </div>
    
    <div class="menu">m
    m
    m
    </div>
    </body>
    </html>
    PS alle Variabellen sind absichtlich etwas ungewöhnlich gewählt...

    Die positionierung um auch designs mit absolut mittiger bzw rechter , linker .... positionierung.

    das line-height um zu simulieren, das der content höher als die browserhöhe ist.

    Die farben nur zur veranschaulichung.

    Die positionierung, des content zu oberst im Text aus SEO gründen.

    So nun hoffe ich mal das das noch einer rafft und ne antwort geben kann.
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Müsste so gehen:
    Nimm einen zusätzlichen Container, in den du Menue und Content hineinpackst. Dann bastelst du dir mit den beiden Farben eine kleine "Querschnittsgrafik" wie in der Anleitung beschrieben und fügst sie als background mit repeat-y in diesen äußeren Container ein. Somit müsste sich die Länge des kürzeren Containers jeweils der des längeren anpassen.
    Falls du dann noch einen unteren abschließenden Rahmen brauchst, einfach diesen in einen zusätzlichen Div packen.

  3. #3
    Forum Guru
    Themenstarter

    Registriert seit
    28.12.2004
    Ort
    Ringgenberg(bei Interlaken) / Schweiz
    Beiträge
    4.787
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    naja wie sprch eins ein weiser mensch, nicht schön, aber selten aber wie ?!

    Ich dachte es aber eher in dieser variante...
    http://www.satzansatz.de/cssd/columnswapping.html

    die machen das noch irgent wie anders.

Ähnliche Themen

  1. divx mit faux columns - firefox und ie wollen beide nicht
    Von mr.tino im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 16.04.2008, 23:32
  2. Plone 3 main block columns
    Von schneebi12 im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 2
    Letzter Beitrag: 06.02.2008, 10:35
  3. tables, columns
    Von Finne im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 01.02.2007, 14:58

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •