Jump to content

Two column shows as One Column!


NJC
 Share

Recommended Posts

Something happened somewhere and now my Catergory, Individual, Date Based archive template shows just a one column instead of two column. The content of the sidebar (2nd - beta - column) follows the content of the 1st - alpha - column.Blog: Not Just Cricket: Technology ArchivesHere is the code for the 'alpha'. Can anyone help in identifying the code error. I've tried, but somehow just cannot find it.

<body class="layout-two-column-right">   <div id="container">	  <div id="container-inner" class="pkg">		 <div id="banner">			<div id="banner-inner" class="pkg">			   <h1 id="banner-header"><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName encode_html="1"$></a></h1>			   <h2 id="banner-description"><$MTBlogDescription$></h2>			</div>		 </div>		 <div id="pagebody">			<div id="pagebody-inner" class="pkg">			   <div id="alpha">				  <div id="alpha-inner" class="pkg">					 					 <p class="content-nav">						<a href="<$MTBlogURL$>">Main</a>					 </p>					 					 <MTEntries>					 <$MTEntryTrackbackData$>					 <MTDateHeader><h2 class="date-header"><$MTEntryDate format="%x"$></h2></MTDateHeader>					 <a id="a<$MTEntryID pad="1"$>"></a>					 <div class="entry" id="entry-<$MTEntryID$>">						<h3 class="entry-header"><a href="<$MTEntryPermalink archive_type="Individual"$>"><$MTEntryTitle$></a></h3>						<div class="entry-content">						   <div class="entry-body">							  <$MTEntryBody$>							  <MTEntryIfExtended>							  <p class="entry-more-link">								 <a href="<$MTEntryPermalink$>#more">Continue reading "<$MTEntryTitle$>" »</a>							  </p>							  </MTEntryIfExtended>							  <p class="entry-footer">								 <span class="post-footers">Posted by: <b><i> <$MTEntryAuthorDisplayName$></b></i></span> <span class="separator">|</span>  <a class="permalink" href="<$MTEntryPermalink$>"><img alt="folder_link.png" src="http://www.notjustcricket.com/images/folder_link.png" width="16" height="16" /></a>  |  <MTIfPingsActive><a href="<$MTEntryPermalink$>#trackback"></a></MTIfPingsActive><a href="<$MTEntryPermalink$>#comments"><img alt="user_comment.png" src="http://www.notjustcricket.com/images/user_comment.png" width="17" height="17" />	 <$MTEntryCommentCount$></a>  |  </MTIfCommentsActive>		  <img alt="clock_red.png" src="http://www.notjustcricket.com/images/clock_red.png" width="16" height="16" />	<$MTEntryDate format="%H:%M "$>  |  <img alt="calendar_view_day.png" src="http://www.notjustcricket.com/images/calendar_view_day.png" width="16" height="16" />   <$MTEntryDate format="%b %d "$><b>Posted to: <MTEntryCategories glue=" | "><a href="<$MTCategoryArchiveLink$>"><i><$MTCategoryLabel$></i></a></MTEntryCategories></b>							  </p>						   </div>						</div>					 </div>					 </MTEntries>				  </div>			   </div>

Hope someone can help.

Link to comment
Share on other sites

the short answer is that the 2 columns need more width than the container is giving them. Remember padding and margin take up width not just the width you assign to the divs... reduce the width of one of the columns until it bumps back into place.Keep in mind I am saying this as mostly a guess since you did not show any CSS.

Link to comment
Share on other sites

the short answer is that the 2 columns need more width than the container is giving them. Remember padding and margin take up width not just the width you assign to the divs... reduce the width of one of the columns until it bumps back into place.Keep in mind I am saying this as mostly a guess since you did not show any CSS.
If you look at the main page at http://www.notjustcricket.com, the layout shows the two columns. Would this 'issue' of columns still point to something in CSS?Here is the CSS code:
/*name: Stevensondesigner: Lilia Ahnerdesigner_url: [url="http://www.lilia.com"]http://www.lilia.com[/url]developer: Lilia Ahnerdeveloper_url: [url="http://www.lilia.com"]http://www.lilia.com[/url]*//* $Id: theme-stevenson.css 14270 2005-07-06 01:20:10Z ydnar $ *//* basic page elements */body{	font-family: 'trebuchet ms', times, serif;	font-size: 11px;	background-color: #e2e2e2;}a { color: #06C; text-decoration: none; }a:visited { color: #369; }a:hover { color: #900; }#banner a {color: #bcaace;	text-decoration: none;}#banner a:visited {color: Yellow;}#banner a:hover {	color: Maroon; }.module-content a { color: #96c; font-weight: bold; }.module-content a:visited { color: #bcaace; }.module-content a:hover { color: #9c0; }h1, h2, h3, h4, h5, h6{	font-family: "Trebuchet MS";}.module-header,.trackbacks-header,.comments-header,.comments-open-header,.archive-header{	/* ie win (5, 5.5, 6) bugfix */	p\osition: relative; 	width: 100%;	w\idth: auto;		margin: 0 0 1px 0;	padding: 5px 5px 5px 25px;	color: #fff;	background: #799de7 url(colitem-header-bg.gif) 0 50% repeat;	font-size: 12px;	font-weight: bold;	text-transform: none;	line-height: 1;}.module-header a,.module-header a:visited,.trackbacks-header a,.trackbacks-header a:visited,.comments-header a,.comments-header a:visited,.comments-open-header a,.comments-open-header a:visited.archive-header a,.archive-header a:visited{	color: #fff;}.module-header a:hover,.trackbacks-header a:hover,.comments-header a:hover,.comments-open-header a:hover,.archive-header a: hover{	color: #369;}.module-content a {color: #369; font-weight: lighter;}.module-content a:visited { color: #6e849a; }.module-content a:hover { color: #900; }.entry-more-link,.entry-footer,.comment-footer,.trackback-footer,.typelist-thumbnailed{	font-size: 10px;}/* page layout */body{	min-width: 780px;	color: #333;	background: #e1e0e0 url(body-bg.gif) repeat; <-- THIS IS YOUR PROBLEM	background-color: #e2e2e2;}#container{	width: 780px;	background: transparent url(container-bg.gif) repeat-y;	background-color: #e2e2e2;}#container-inner{	margin: 0 10px 0 10px;	border-bottom: 1px solid #4A87B9;	background: transparent url(column-right-bg.gif) -500px 0 repeat-y;	background-color: #e2e2e2}#banner{	width: 760px; /* necessary for ie win */	border-bottom: 1px solid #000;	background: #369 url(banner-bg.gif) repeat;	}#banner-inner { padding: 20px; }.banner-user{	width: 70px;	margin-top: 4px;	font-size: 12px;	font-weight: normal;	text-align: center;}.banner-user-photo { border: 3px double #fff; }#banner-header{	margin: 20;	font-size: 60px;	font-family: Architext;		font-weight: bold;	line-height: 1;	text-align: center;}#banner-description{	margin: 1px 0;	color: #fff;	background: none;	font-size: 14px;			line-height: 1.125;	text-align: center;}#alpha { margin: 20px 0 20px 20px; width: 260px; }#beta { margin: 20px 0 0 40px; width: 420px; }#gamma, #delta { width: 202px; }.date-header{	margin: 0;	padding-top: 5px;	padding-bottom: 5px;	padding-left: 5px;	color: Maroon;	background: transparent url(date-header-bg.gif) repeat-x;	font-size: 11px;	background: #CCCCCC;}.entry-header{	margin: 10px 0;	padding: 0 0 0 20px;	color: #005A5B;	background: transparent url(entry-header-bg.gif) 0 0.2em no-repeat;	font-size: 16px;	font-weight: lighter;	font: Book Antiqua;}.entry-content { margin: 0; }.entry-footer{	margin: 0 0 20px 0;	border-top: 1px solid Black;	padding-top: 2px;	font-weight: normal;	background: ThreedFace;	border-bottom: 1px solid Black;	}.content-nav { padding-top: 0; }/* modules */.module-calendar .module-content { margin: 5px 0 15px 0; }.module-mmt-calendar .module-content table,.module-calendar .module-content table { font-size: 11px; }.module-calendar .module-content table th { font-size: 10px; }.module-mmt-calendar .module-header a { color: #900; }.module-mmt-calendar .module-header a:visited { color: #900; }.module-mmt-calendar .module-header a:hover { color: #069; }.module-powered { margin: 20px 0; }.module-powered .module-content{	margin: 0;	font-size: smaller;	padding: 10px;	border: 1px solid #ccc;	color: #333;	background: #dcd8d8 url(powered-bg.gif) repeat-x;}.module-powered a { color: #369; }.module-powered a:visited { color: #369; }.module-powered a:hover { color: #900; }.module-photo { background: none; }.module-photo img { border: solid 1px #dce1e4; }.module-list-item{	padding-left: 14px;	background: url(li-bg.gif) 0 0.3em no-repeat;	line-height: 150%;}.typelist-thumbnailed .module-list{	margin: 0;}.typelist-thumbnailed .module-list-item{	margin: 0 0 1px 0;	padding: 0;	border: 1px solid #d9dee1;	background: #e5e5e5 url(typelist-thumbnailed-bg.gif) repeat-x;}.typelist-thumbnail { background: #fff; }.module-featured-photo img{	width: 414px;}/* recent photos */.module-recent-photos .module-content { margin: 6px 0 0 0; }.module-recent-photos .module-list { margin: 0; }.module-recent-photos .module-list-item{	width: 64px; /* mac ie fix */	margin: 0 6px 6px 0;	padding: 0;	background: none;}.module-recent-photos .module-list-item a{	border: 1px solid #369;	padding: 1px;	background: #fff;}.module-recent-photos .module-list-item a:hover{	border-color: #900;}/* artistic tweaks *//* calendar tweaks */		.layout-calendar #beta { overflow: visible; }		.module-mmt-calendar { width: 420px; }			.module-mmt-calendar .module-header	{		margin: 0;		border: 0;		padding: 0;		color: #999;		background: none;		font-size: 14px;		font-weight: normal;		text-align: right;		text-transform: none;	}		.module-mmt-calendar table	{		margin-top: 6px;		color: #fff;		background: #bcc5cc;	}		.module-mmt-calendar th	{		border-right: 1px solid #eee;		border-bottom: 1px solid #eee;		padding: 2px;		background: #84a7ed;		text-align: right;		font-weight: normal;	}		.module-mmt-calendar td	{		border-right: 1px solid #eee;		border-bottom: 1px solid #eee;		padding: 2px;		background: #c3c3c3 url(calendar-td-bg.gif) repeat-x;		text-align: right;		font-weight: normal;	}		.module-mmt-calendar .weekday-7, td.day-7, td.day-14, td.day-21, td.day-28, td.day-35, td.day-42	{		border-right: none;	}		.day-photo a	{		border: solid 1px #369;		padding: 1px;		background: #fff;	}		.day-photo a:hover	{		border-color: #900;	}/* moblog1 tweaks */	.layout-moblog1 #container-inner { background-position: -220px 0; }	.layout-moblog1 #pagebody	{		background: transparent url(column-left-bg.gif) -580px 0 repeat-y;	}		.layout-moblog1 #alpha { width: 200px; }		.layout-moblog1 #beta	{		width: 320px;		margin: 20px 0 20px 20px;	}		.layout-moblog1 #gamma	{		width: 160px;		margin: 20px 0 20px 40px;	}		.layout-moblog1 .entry { margin-bottom: 40px; }		.layout-moblog1 .module-recent-photos .module-content { margin: 6px 0 0 12px; }	.layout-moblog1 .module-powered .module-content	{		margin-right: 20px;	}/* moblog2 tweaks */	.layout-moblog2 #container-inner { background-position: -350px 0; }	.layout-moblog2 #pagebody	{		background: transparent url(column-left-bg.gif) -690px 0 repeat-y;	}	.layout-moblog2 #pagebody-inner	{		background: transparent url(column-right-bg.gif) -160px 0 repeat-y;	}		.layout-moblog2 #alpha { width: 70px; }	.layout-moblog2 #beta { width: 300px; margin: 0 0 0 40px; }	.layout-moblog2 #gamma { width: 170px; margin: 0 0 0 40px; }		.layout-moblog2 #delta	{		float: left;		width: 100px;		margin: 0 0 0 20px;	}		.layout-moblog2 .module-header,	.layout-moblog2 .trackbacks-header,	.layout-moblog2 .comments-header,	.layout-moblog2 .comments-open-header,	.layout-moblog2 .archive-header	{		margin: 20px 0 1px 0;	}		.layout-moblog2 .date-header { margin-top: 20px; }		.layout-moblog2 .content-nav { padding-top: 20px; }		.layout-moblog2 .module-photo .module-content { margin: 0; }	.layout-moblog2 .module-photo img { width: 80px; height: auto; }		.layout-moblog2 .module-recent-photos .module-content	{		margin: 0;		padding: 0;		background: none;	}		.layout-moblog2 .module-recent-photos .module-list { margin: 0; }	.layout-moblog2 .module-recent-photos .module-list-item { margin: 0 0 5px 0; }		.layout-moblog2 .module-powered .module-content	{		margin-right: 20px;	}	/* timeline tweaks */	.layout-timeline #container-inner { background-position: -420px 0; }		.layout-timeline #alpha { width: 340px; }	.layout-timeline #beta { width: 360px; }		.layout-timeline #gamma,	.layout-timeline #delta	{		width: 170px;	}		.layout-timeline .module-recent-photos .module-content { padding: 0 0 10px 0; }	.layout-timeline .module-recent-photos .module-list { margin: 7px 7px 0 0; }/* one-column tweaks */	.layout-one-column body	{		min-width: 620px;	}		.layout-one-column #container	{		width: 620px;		background: transparent url(one-column-container-bg.gif) repeat-y;	}		.layout-one-column #container-inner	{		margin: 0 10px 0 10px;		border-bottom: 1px solid #5b626a;		background: transparent url(column-right-bg.gif) -500px 0 repeat-y;	}		.layout-one-column #banner	{		width: 594px; /* necessary for ie win */	}		.layout-one-column #container-inner { background: none; }	.layout-one-column #alpha { width: 560px; }		/* two-column-left tweaks */	.layout-two-column-left #container-inner { background: none; }	.layout-two-column-left #pagebody	{		background: transparent url(column-left-bg.gif) -580px 0 repeat-y;	}		.layout-two-column-left #alpha { width: 200px; }	.layout-two-column-left #beta	{		width: 500px;		margin: 20px 0 0 20px;	}		.layout-two-column-left .module-powered .module-content	{		margin-right: 20px;	}/* two-column-right tweaks */	.layout-two-column-right #container-inner {	/*background: none;*/	background-color: InfoBackground;}	.layout-two-column-right #pagebody	{		background: transparent url(column-right-bg.gif) -270px 0 repeat-y;	}		.layout-two-column-right #container-inner { background: none; }	.layout-two-column-right #alpha { width: 490px; }	.layout-two-column-right #beta	{		width: 200px;		margin: 20px 0 0 40px;	}/* three-column tweaks */		.layout-three-column #container-inner { background-position: -260px 0; }	.layout-three-column #pagebody	{		background: transparent url(column-left-bg.gif) -580px 0 repeat-y;			}		.layout-three-column #alpha { width: 160px; }		.layout-three-column #beta	{		width: 300px;		margin: 20px 0 20px 20px;	}		.layout-three-column #gamma	{		width: 160px;		margin: 20px 0 20px 40px;	}		.layout-three-column .module-powered .module-content	{		margin-right: 20px;	}	

Link to comment
Share on other sites

It's probably that either the Youtube video or one of the images are making the left column too wide, and pushing the right column below it. Try increasing the size of the container.
Thank, JSG!You were right.Youtube screens increased in width after their recent service and site upgrade, and this was knocking the columns out! I also had some posts with text formatting creating the same issue.Fixed and done and thanks for pointing me in the right direction.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...