Mart Laub
Mart Laub

Reputation: 15

Joomla 3 template - module width in wrapper

First of all, I'd like to apologize, if this problem already has an answer in stackoverflow.com, it's just that I couldn't think of a way how to google the solution. Anyway, here's my problem: I'm working on a Joomla! 3.0.2 website and I have encountered a problem with div width.

I want to have 2 different div-s in my wrapper as so:

<div class="wrapper">
  <div class="content"></div>
  <?php if($this->countModules('sidebar')) :?>
     <div class="sidebar"></div>
  <?php endif; ?>
</div>

I want the "content" to have 70% width of the wrapper and "sidebar" to have 30%, but only when the sidebar has been selected. If sidebar module is not active, I want the "content" width to be 100% .. my question is - how do i do that? I've tried numerous options in css but so far i have not succeeded.

Upvotes: 0

Views: 785

Answers (1)

Patrick Evans
Patrick Evans

Reputation: 42736

set a second class to the content div if countModules('sidebar') is 0 and use css to set styles

SCRIPT

<div class="wrapper">
  <div class="content <?php if($this->countModules('sidebar')==0) echo "full"; ?>"></div>
  <?php if($this->countModules('sidebar')) :?>
     <div class="sidebar"></div>
  <?php endif; ?>
</div>

CSS

.content {
   width:70%;
}

.content.full {
   width:100%;
}

.sidebar {
   width:30%;
}

the .content.full selector will override the .content one.

Upvotes: 1

Related Questions