Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.
Seiten: 1
#1 26. Februar 2011 21:08
- mörml
- Server-Pate
- Registriert: 23. Januar 2011
- Beiträge: 443
mehrspaltiges Template
Hallo ihr lieben Nochnichtverzweifelten,
ich probiere seit heute morgen am Stück, doch ich bekomme einfach kein dreispaltiges Design hin, es ist zum Beklopptwerden
CSS4you, Firebug, rumprobieren hat alles nichts geholfen.
Lediglich, wenn ich die zweite Sitebar zwischen erster und Content im Template einfüge, werden mir drei Spalten ausgeworfen, allerdings in genau der Reihenfolge. Was ich mir wünsche, ist aber Sidebar - Content - Sidebar.
Meine 2.zweite Sidebar sieht so aus:
<div id="sidebarright">
{global_content name='Sidebar rechts'}
</div>
Ich poste das Template hier (ohne zweite Sidebar):
{process_pagedata}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>{sitename} - {title}</title>
{metadata}
{stylesheet}
{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}
{literal}
<script type="text/JavaScript">
<!--
//pass min and max - measured against window width
function P7_MinMaxW(a,b){
var nw="auto",w=document.documentElement.clientWidth;
if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</script>
<!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}
<!--[if lte IE 6]>
<script type="text/javascript" src="modules/MenuManager/CSSMenu.js"></script>
<![endif]-->
{* The above JavaScript is required for CSSMenu to work in IE *}
</head>
<body>
<div id="pagewrapper">
<ul class="accessibility">
<li>{anchor anchor='menu_vert' title='Skip to navigation' accesskey='n' text='Skip to navigation'}</li>
<li>{anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}</li>
</ul>
<hr class="accessibility" />
<div id="header">
<h2 class="headright">{sitename}</h2>
<h1>{cms_selflink dir="start" text="$sitename"}</h1>
<hr class="accessibility" />
</div>
<div id="menu_vert">
<h2 class="accessibility">Navigation</h2>
{menu template='cssmenu.tpl'}
<hr class="accessibility" />
</div>
<div id="search">
{search}
</div>
<div class="crbk">
<div class="breadcrumbs">
{breadcrumbs starttext='Sie befinden sich hier' root='Home' delimiter='»'}
<hr class="accessibility" />
</div>
</div>
<div id="sidebar">
<div id="sidebarb">
{content block='Sidebar'}
<div id="news">
<h2>News</h2>
{news number='5' detailpage='news'}
</div>
</div>
</div>
<div id="content">
<div class="back1">
<div class="back2">
<div class="back3">
<div id="main">
<div style="float: right;">{print showbutton=true script=true}</div>
<h2>{title}</h2>
{content}
<br />
<div class="right49">
<p>{anchor anchor='main' text='^ oben'}</p>
</div>
<div class="left49">
<p> {cms_selflink dir="previous" label="Vorherige Seite: "}
<br />
{cms_selflink dir="next" label="Nächste Seite: "}
</p>
</div>
<hr class="accessibility" />
<div class="clear"></div>
</div>
</div>
</div>
</div>
</div>
<div class="footback">
<div id="footer">
<div id="footrt">
{global_content name='footer'}
</div>
<div class="clear"></div>
</div>
</div>
</div>
</body>
</html>
Das entsprechende CSS-Element sieht so aus (und funzt natürlich auch nicht):
div#sidebarright
{
float: left;
width: 20%;
display: inline;
margin-right: 12px 0px 20px;
padding: 10px;
background: url(background2.gif) no-repeat right top;
}
Vielleicht erbarmt sich einer.
Herzlichst
mörml
kann CMSms buchstabieren...
CMSms 1.11.12
PHP 5.5.14
Offline
#2 27. Februar 2011 19:55
- Tobias_Gl
- probiert CMS/ms aus
- Ort: Siegen
- Registriert: 09. November 2010
- Beiträge: 69
- Webseite
Re: mehrspaltiges Template
Mehrspaltige Templates kannst du sehr gut mit YAML erstellen.
YAML ist extra dafür erstellt worden um Mehrspaltige Designs möglichst flexibel zu erstellen. Eine sehr gute Hilfe zum Umgang mit YAML bietet die Internetseite oder das Buch von Herrn Jesse.
Falls du es anders probiern willst würde ich dir folgende Struktur vorschlagen:
[== HTML ==]
<div id="maincontainer">
<div id="left_col"></div>
<div id="right_col"></div>
<div id="center_col"></div>
</div>
[== CSS ==]
#maincontainer {
width:auto;
max-width:1280px;
min-width:1004px;
background-color:#ffffff;
margin:0 auto;
padding:0px;
overflow:hidden;
}
#left_col {
width:200px;
float: left;
}
#right_col {
float:right;
width:200px;
}
#center_col {
margin-right:200px;
margin-left:200px;
border-left: 1px solid #cccccc;
border-right:1px solid #cccccc;
padding:0px;
}
Offline
#3 27. Februar 2011 20:49
- Connie
- Server-Pate
- Ort: Gribow
- Registriert: 12. Dezember 2010
- Beiträge: 216
- Webseite
Re: mehrspaltiges Template
Hast du mal von "Faux Columns" gehört? Das ist ein Schlüsselwort für gleich hohe Bereiche nebeneinander
ich hab leider grad meine LInks nicht bei mir, bin auf der Datscha ...
aber du findest mit dem Stichwort sicherlich die richtigen CSS-Infps
Offline
#4 28. Februar 2011 03:34
- mörml
- Server-Pate
- Registriert: 23. Januar 2011
- Beiträge: 443
Re: mehrspaltiges Template
Vielen, vielen Dank an Tobias, dein Tipp war goldwert.
Und herzlichen Dank an Connie, die mein nicht genanntes zweites Problem angesprochen hat. Ich guck mir das an!
Beste Grüße
mörml
kann CMSms buchstabieren...
CMSms 1.11.12
PHP 5.5.14
Offline
#5 28. Februar 2011 08:48
- Andynium
- Moderator
- Ort: Dohna / SN / Deutschland
- Registriert: 13. September 2010
- Beiträge: 7.018
- Webseite
Re: mehrspaltiges Template
Ein fertiges YAML-Template gibt es auch im Theme-Archiv auf der .org ...
Offline
Seiten: 1