> You are strongly advised to override this module's CSS to provide a gutter: this is not provided by the module's own CSS as it's not cleanly possible with percentage widths.

Could someone provide some instructions for this? I know nothing about CSS, but if I know where the file is and what line of text to replace, then i can make a simple edit. I appreciate any help.

Comments

nikitas’s picture

install firebug at firefox ( at the extensions or add ons) restart firefox check the html are where u want to make changesand read the css style properties from the window of the firebug.that will help you for a start.

joachim’s picture

Yup, this is a bit of a code 'n' run module -- needed it for a client, whipped it up quickly, thought I'd share it :)
It's really aimed at themers who are comfortable with CSS.
If anyone has time to add a documentation page with some CSS examples, I'll link to it from the project page :)

jsgammato’s picture

I figured it out, I think. Here's what I did:
(please feel free to correct this until it is usable)
1. Make a copy of columns_filter.css (from the installed module).
2. Edit the copy to change the following three values (note the space separating each pair of values):
FROM width: 50%; TO width: 48% 2%;
and
FROM width: 22% TO width: 32% 1%;
and
FROM width: 25% TO width: 24% 1%;

3. Rename the columns_filter.css in the installed module to columns_filter.OLD
4. Copy the edited version of columns_filter.css into the module folder.
5. Test it. If it's no good, rename the old one and restore it, then ask someone else for help.

In the end it should look like:

/* $Id: columns_filter.css,v 1.1 2009/06/22 16:39:00 joachim Exp $ */ 
.content .content-column {
  float: left;
}
.content .content-column-2 {
  width: 48% 2%;
}
.content .content-column-3 {
  width: 32% 1%;
}
.content .content-column-4 {
  width: 24% 1%;
}
joachim’s picture

Um?
I'm pretty sure width doesn't take more than one value: http://www.w3.org/TR/CSS2/visudet.html#the-width-property

Second, there is no need to change the module itself: do this in your theme CSS.
You can even override the CSS file wholesale, I think.

joachim’s picture

Status: Active » Closed (fixed)