Zikula Community

• jaenosjelantru
  
  

  • Rank: Moderator
  • Registered: Mar 15, 2005
  • Last visit: May 30, 2010
  • Posts: 1077

  Posted: Apr 15, 2008 - 07:57 AM

  I am trying to do this with blocks:
  
  
  
  This is the original code to display the home page in standard Andreas08:
  
  

  Code

  <div id="theme_content">
  <!--[blockposition name=center]-->
  <div id="theme_splitcontentleft">
  <!--[blockposition name=right]-->
  </div>
  
  <div id="theme_splitcontentright">
  <!--[$maincontent]-->
  </div>
  </div>
  
  <div id="theme_subcontent">
  <!--[blockposition name=left]-->
  </div>

  
  
  And the accompanying CSS:
  
  

  Code

  #theme_content{
  float:left;
  width:75%;
  font-size:0.9em;
  padding:10px 0 0 10px;
  }
  
  and
  
  .theme_splitcontentleft{float:left; width:48%;}
  .theme_splitcontentright{float:right; width:48%;}

  
  
  And this is the edited home template:
  
  

  Code

  <div id="theme_content">
  <!--[blockposition name=center]-->
  
  <div id="theme_splitcontentleft">
  <!--[blockposition name=right]-->
  
  <div id="theme_splitcontentright">
  <!--[blockposition name=left_main]-->
  <!--[blockposition name=right_main]--></div>
  </div>
  </div>

  
  
  The result is the left_main block displaying on top of the right_main.
  
  
  Shouldn't these float left and float right and be even or am I still a CSS noob?
  
  
  
  edited by: jaenosjelantru, Apr 15, 2008 - 01:58 PM
  
  --
  [ stevencopley.com ]

  • 
  •  
• jaenosjelantru
  
  

  • Rank: Moderator
  • Registered: Mar 15, 2005
  • Last visit: May 30, 2010
  • Posts: 1077

  Posted: Apr 15, 2008 - 08:10 AM

  GG, I answered my own question. I changed the home template to this:
  
  

  Code

  <div id="theme_content">
  <!--[blockposition name=center]-->
  
  <div id="theme_splitcontentleft">
  <!--[blockposition name=left_main]--></div>
  
  
  <div id="theme_splitcontentright">
  <!--[blockposition name=right_main]--></div>
  
  </div>

  
  
  And the CSS to this:
  

  Code

  #theme_splitcontentleft{float:left; width:48%;}
  #theme_splitcontentright{float:right; width:48%;}

  
  
  --
  [ stevencopley.com ]

  • 
  •  
• AmmoDump
  
  

  • Rank: Team Member
  • Registered: Dec 07, 2003
  • Last visit: May 09, 2010
  • Posts: 2703

  Posted: Apr 15, 2008 - 08:11 AM

  without getting into your CSS
  
  Study overflow and clear
  
  --
  David Pahl
  Zikula Support Team

  • 
  •  
• jaenosjelantru
  
  

  • Rank: Moderator
  • Registered: Mar 15, 2005
  • Last visit: May 30, 2010
  • Posts: 1077

  Posted: Apr 15, 2008 - 08:12 AM

  Ok, that is nice for the home template but now the master is jacked. I suppose I just need to create new elements for the home page and not jack with the others.
  
  Let me test!
  
  --
  [ stevencopley.com ]

  • 
  •  
• jaenosjelantru
  
  

  • Rank: Moderator
  • Registered: Mar 15, 2005
  • Last visit: May 30, 2010
  • Posts: 1077

  Posted: Apr 15, 2008 - 08:16 AM

  Ok that worked. I answered my own seemingly ridiculous question.
  
  Pardon the interruption, move along please!
  
  --
  [ stevencopley.com ]

  • 
  •  
• jaenosjelantru
  
  

  • Rank: Moderator
  • Registered: Mar 15, 2005
  • Last visit: May 30, 2010
  • Posts: 1077

  Posted: Apr 15, 2008 - 08:17 AM

  Thanks for the advice. I obviously need to read up on some CSS. I've just been getting by for a few years. Maybe it's time I actually learned it!
  
  --
  [ stevencopley.com ]

  • 
  •  
• AmmoDump
  
  

  • Rank: Team Member
  • Registered: Dec 07, 2003
  • Last visit: May 09, 2010
  • Posts: 2703

  Posted: Apr 15, 2008 - 08:27 AM

  http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats/
  
  http://www.positioniseverything.net/easyclearing.html
  
  
  
  --
  David Pahl
  Zikula Support Team

  • 
  •  
• espaan
  
  

  • Rank: Developer
  • Registered: Aug 23, 2003
  • Last visit: May 31, 2010
  • Posts: 1401

  Posted: Apr 16, 2008 - 12:02 AM

  And for a framework for multi column layouts check out the YAML framework. It even contains a yaml builder where you can choose the layout and look at the code afterwards.
  The BlankTheme theme (Mateo, David and myself) is trying to get the builder into BlankTheme as well BlankTheme is based upon YAML, so it contains all the flexibility and is PN ready.
  
  A List Apart Holy Grail 3 column layout is also very instructive.
  
  --
  campertoday.nl, Module development, Dutch Zikula Community

  • 
  •  
•  
•  

Users on-line

• bvdbos3,
• mazdev

This list is based on users active over the last 60 minutes.