I would concur with the float: left being the issue. But this will break the left and right columns so for the left you will need left: 0px /* Or what ever */ and the inverse for the right column.
max and min width has issues in MSIE6 so youll need to decide if you want to support it or not.
OK, so it is OK to have the float: left; on the leftcolumn, then have left: 0px; on the centercolumn and a right: 0px; on the rightcolumn... can I still use the float: right; on the rightcoumn?
Also, so why can't you have float: left; and max-width on the same div element?
OK and I did that... and the page doesn't look right...
http://default.tsgcomputers.net/
Everything is still left aligned.
The code you had originally should have lined up your areas nicely. The issue is if you want the content area to expand depending on sidebars being enabled, then you're going to have to define some classes (either in a template file, php, or somewhere - I can't tell you where since I'm not a joomla guy (yet)).
In drupal, you'd modify your template.php file to check to see if the sidebars are there. If, for example, the left one was there, you'd add a class "sidebar-left" which would push the content over where it needed to be. If both sidebars are there, then sidebar-right would squish the content inwards where it needed to be.
You can't do what you want purely in css (afik), not without defining some extra classes and adding them to your template depending on if the sidebars are there.
Umm, you need to move your right block to underneath the content block (it's floating up above your content area where it's at now).
What does your php file look like? Do you have something like
<?php print $right_sidebar ?>If so, then when I went to print out the center block:
<?php if ($right_sidebar) $sidebarclass = "rightsidebar "; ?>
<?php if ($left_sidebar) $sidebarclass .= "leftsidebar"; ?>
<?php if ($right_sidebar) $sidebarclass = "bothsidebars"; ?>
<div id="centercontent" class="<?php print $sidebarclass ?>">Then you can create the classes (rightsidebar, leftsidebar, bothsidebars) which would then define the width of the center content.
both width:66%
one only then width:85%
none then width:100%
Floats want a width, and when you give them max-width, they assume the max right away.
The best way to address your issue is in the PHP itself -- change the class name you're using depending upon the columns going to be displayed on the page.
countModules is the php function you need to figure out if there are any modules in a position that will be displayed. I've not seen your template code, so I won't speculate on where you should use it.
Have look here for further details: http://docs.joomla.org/JDocumentHTML/countModules
The basic idea is to create multiple layouts in your CSS depending on the class name, then decide which class name to use based on what modules will be displayed.
Hey everyone,
I've really enjoyed posting here... so I figured I would post some more...
I've got a template that I am working on.
I am trying to give the center content a variable width based on the other objects around it.
For instance I have a left, center and right columns.
I want the center column to expand based on whether the left or right columns are enabled.
But as it seems, when I change the max-width to something higher than what is available... then the object moves beneath the left and right columns. Or at least something to that same effect.
Any ideas?
The HTML that that I am using is strictly using the variables set in CSS. So all of the HTML is nothing but < div > elements and some PHP to enable the elements.
Here is the CSS that I am using:
#right{ position: relative; top: 0px; width: 15%; margin: 5px 0px 5px 5px; float: right; z-index: 1; } #left{ position: relative; top: 0px; width: 15%; float: left; margin: 5px 5px 5px 0px; z-index: 1; } #centercontent{ position: relative; margin: 5px 0px; min-width: 66%; /* max-width: 100%; */ float: left; }Thank you guys and God bless,
Johnathan