content appearing under left column

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
toolman
Forum Members
Forum Members
Posts: 51
Joined: Wed Sep 12, 2007 5:10 pm

content appearing under left column

Post by toolman »

Hi there,

For some reason my main content is appearing under my left menu and also my right column.

This is my style for the

columns

Code: Select all

div#leftsidebar {
   float: left;
   margin-left: 0px;
   margin-right: 0px;
   width: 160px;   
   padding: 2px;
}

div#rightsidebar {
   float: right;
   margin-left: 3px;
   margin-right: 3px;
   margin-bottom: 5px;
   width: 160px;
   padding: 0px;
}

div#main {
   float: left;
   width: 380px; 
   margin-left: 0px;
   margin-right: 0px;
   padding: 0px;
   background-color: #EFEFEF ;
}

and this is the code for the template

Code: Select all

{* Start Content (Navigation and Content columns) *}
   <div id="content">

      {* Start Sidebar *}
      <div id="leftsidebar">

      {* Start Navigation *}
      <div id="menu_vert">
         <h2 class="accessibility">Navigation</h2>
         {menu template='simple_navigation.tpl' collapse='1'}
      </div>
      {* End Navigation *}

      {* Start News *}
   {*   <div id="news">
         <h2>News</h2>
          {news number='3' detailpage='news'}
      </div> *}
      {* End News *}

      </div>
      {* End Sidebar *}



 {* Start Sidebar *}
     <div id="rightsidebar" >
test text

      </div
      {* End Sidebar *}




      {* Start Content Area *}
      <div id="main">
         <div>{print showbutton=true script=true}</div>
         <h2>{title}</h2>
         {content} <br />

         {* Start relational links *}
	 <div class="hr"></div>
	 <div class="right49">
	 	<p>{anchor anchor='main' text='^ Top'}</p>
	 </div>
         <div class="left49">
            <p>{cms_selflink dir="previous" label="Previous page: "} <br />
            {cms_selflink dir="next"}</p>
         </div>
         {* The label parameter doesn't need to be there if you're using English, but is here to show how it's used if you don't want the English text "Previous page" *}
	 {* End relational links *}

      <hr class="accessibility" />
      </div>
	  {* End Content Area *}
Any ideas why this is happening?
SideshowBob
Forum Members
Forum Members
Posts: 80
Joined: Thu Sep 13, 2007 10:50 am

Re: content appearing under left column

Post by SideshowBob »

Hi Toolman,

Have you tried building this template outside of CMSMS? I think it might make troublehooting a little easier.

Your closing div for rightsidebar is wrong and there is no closing div for your content div either.

Otherwise the code renders as it should, however I suspect if you move div rightsidebar in your code to below div main then you will get the result you want.

cheers,
Bob
toolman
Forum Members
Forum Members
Posts: 51
Joined: Wed Sep 12, 2007 5:10 pm

Re: content appearing under left column

Post by toolman »

Thank you :)

I got that fixed, but now the main content is appearing below where the left column finishes instead of aligning to the top of the left column. Do you have any ideas what could be causing this.
SideshowBob
Forum Members
Forum Members
Posts: 80
Joined: Thu Sep 13, 2007 10:50 am

Re: content appearing under left column

Post by SideshowBob »

Can you post a url? Makes things much easier...
Post Reply

Return to “Layout and Design (CSS & HTML)”