Hello,

I have created a gallery page with the grid feature of Views. There are 4 rows with 3 thumbnails per row. The problem is that the width of each of the 3 columns is not equal and depends on the length of e.g. the title (which is also shown underneath each thumbnail).

I tried to use CSS to make the column width the same but was not successful.

Could anyone please tell me how I can set the column width of the Grid View equal to each other?

Thank you!

Roger

Comments

jeremy_a’s picture

jeremy_a commented

Did you try...

td {
width: 33%;
}
Militopedia’s picture

Militopedia commented

Hi Jeremy,

Thanks a lot! That solved the issue :-D

I modified the code of my views-view-grid.tpl.php. I added the width statement to following two lines:

table class="views-view-grid" width="100%"

td class=" print 'col-'. ($column_number + 1); " width="33%"

You saved my day!

Roger

merlinofchaos’s picture

merlinofchaos commented
Status: Active » Fixed

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

junro’s picture

junro commented

Hi, I just did the same thing. Using Views Grid to display a photo gallery.

add the code in the grid tpl works great but there are no effects if I put the views-view-grid.tpl.php in my theme folder. What about you?

oskkar’s picture

oskkar commented
Priority: Normal » Critical
Status: Closed (fixed) » Active

Hi. I am going crazy (beyond pulling every strand of hair from my head) trying to set a maximum grid width at the

line of views-view-grid template. Found this post and tried to modify per Militopedia's remarks but did not work.

Believe I put the width code in correct place but something is overriding and grid width is displaying at 100% width instead of what is specified??

Please, if anyone could advise would be greatly appreciated.
Thanks....

dawehner’s picture

dawehner
Primary language German
commented
Priority: Critical » Normal

i suggest you to use firebug, a free firefox addon.
There you can see which css setting is set where, than you can see what overwrites the witdth

jokerejoker’s picture

jokerejoker commented

Add table-layout:fixed; to your table css and the table will adjust :)

http://w3schools.com/css/pr_tab_table-layout.asp

dawehner’s picture

dawehner
Primary language German
commented
Status: Active » Fixed

So this is fixed.

Thanks

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

elBradford’s picture

elBradford commented
Title: Gallery with Grid Views: width of columns not equal » Gallery with Grid Views: Add option to make column widths equal
Version: 6.x-2.2 » 7.x-3.x-dev
Category: support » feature
Status: Closed (fixed) » Active

I'd like to hijack this and turn it in to a feature request. If we could have an optional checkbox with something like "make column widths equal", and add the required CSS on the fly.

merlinofchaos’s picture

merlinofchaos commented

At this time, Views has made the design decision to not actually add dynamic CSS, and as such we aren't likely to do this unless we reverse that decision, which will then require us to re-evaluate how we handle all of the styles.

elBradford’s picture

elBradford commented
Status: Active » Closed (won't fix)

OK, understood.

brayo4’s picture

brayo4 commented

try

http://drupal.org/project/views_fluid_grid