Page 1 of 1
new content type "three column"
Posted: Mon 11. Jul 2005, 11:21
by consistency
made it just for exercise:
quick and dirty implemented an three column html content element.
just try it:
http://www.consistency.at/download/phpw ... col0.1.zip
Posted: Sun 24. Jul 2005, 05:56
by luna
Do you mean three rows content????
After installation on 1.2.3 dev I'm getting the content into three rows and not colums
Posted: Sun 24. Jul 2005, 06:04
by consistency
it is three col content.
in backend its only shown as three rows because editing is easier.
Posted: Sun 24. Jul 2005, 06:20
by luna
ok I have this into the source code
<h3>Title</h3>
<h4>Subtitle</h4>
<div class="threecol" id="threecol">content1</div>
<div class="threecol" id="threecol">content2</div>
<div class="threecol" id="threecol">content3</div>
So is this supposed to work if we add our own "threecol" CSS?
in the zip file there is no an aditional css div class.
Posted: Sun 24. Jul 2005, 06:26
by consistency
oh i missed that, you are the first person testing...
Code: Select all
.threecol
{
float: left;
width: 190px;
/*margin-left: 10px;
margin-right: 10px;*/
padding-left: 10px;
padding-right: 10px;
/*border: 1px solid yellow; */
margin-bottom: 0px;
margin-top: 0px;
}
hope it work now, just tell if something is missing.
Posted: Sun 24. Jul 2005, 06:37
by luna
Ok mate that was
Now work fine but I think that the width is not neccessary
for smaller or larger {CONTENT} than 190 px so this will work best in this way
Code: Select all
.threecol
{
float: left;
/* width: 190px;
/*margin-left: 10px;
margin-right: 10px;*/
padding-left: 10px;
padding-right: 10px;
/*border: 1px solid yellow; */
margin-bottom: 0px;
margin-top: 0px;
}
or setting the width to the {CONTENT} width
BTW. Good Job mate.
Posted: Sun 24. Jul 2005, 06:42
by consistency
thank you for feedback, testing and "likeing"
Posted: Sun 24. Jul 2005, 07:08
by luna
I have tested some more this hack and noticed that i'm giving strange results on different browser.
So i think that an good improvement will be to define float left and right in the css
here is an example code
Code: Select all
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
div#header {
clear: both;
height: 50px;
background-color: aqua;
padding: 1px;
}
div#left {
float: left;
width: 150px;
background-color: red;
}
div#right {
float: right;
width: 150px;
background-color: green;
}
div#middle {
padding: 0px 160px 5px 160px;
margin: 0px;
background-color: silver;
}
div#footer {
clear: both;
background-color: yellow;
}
</style>
</head>
<body>
<div id="header">
<h1>Header</h1>
</div>
<div id="left">
Port side text...
</div>
<div id="right">
Starboard side text...
</div>
<div id="middle">
Middle column text...
</div>
<div id="footer">
Footer text...
</div>
</body>
</html>
This is working fine in all browsers that i was tested.
Posted: Sun 24. Jul 2005, 07:20
by consistency
its the xhtml problem, see my post in this thread:
http://www.phpwcms.de/forum/viewtopic.p ... highlight=
but thanks for correcting.
Posted: Tue 13. Sep 2005, 15:00
by JensZ
Hi,
What is it used for? Is it just used instead of having a template with three custom blocks, say {col1}, {col2}, and {col3}?
Jens
Posted: Tue 13. Sep 2005, 15:10
by consistency
yes, just instead of three custom blocks. it was only an exercise for me, just played around.