Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

DataObjectManager Module /

Discuss the DataObjectManager module, and the related ImageGallery module.

Moderators: martimiz, UncleCheese, Sean, Ed, biapar, Willr, Ingo, swaiba

Column Widths


Go to End


12 Posts   4729 Views

Avatar
JoshuaLewis

Community Member, 81 Posts

6 September 2009 at 4:48am

In my dataobject manager I am only displaying 3 of the dataobjects' fields to keep things clean; a 5 digit product code, a name, and a description. The problem I'm having is that each column is set to 33% of the total available width which leaves the product code with lots of extra space and the name and description squashed.

Is there a way to improve this kind of spacing that I've missed?

Out of curiosity, why is the manager built using divs and lists instead of a table?

Avatar
UncleCheese

Forum Moderator, 4102 Posts

6 September 2009 at 5:08am

Edited: 06/09/2009 5:13am

Because tables suck.

You can't really drag-ang-drop reorder table rows, and tables can't really be fluid widths, which is really useful in the FileDOM grid view.

Try this:

$myDOM->setColumnWidths(array(
'Title' => 20
'Foo' => 20
'Bar' => 60
));

Where 20, 20 and 60 are percentages that must total 100.

Avatar
JoshuaLewis

Community Member, 81 Posts

6 September 2009 at 10:15am

That fixes it, Thank you.

I figured there had to be a good reason for choosing to build it that way, just didn't know what it was.

Side Note:
I think it would be a good idea to set the overflow property on the divs making up the individual table cells to hidden or maybe auto. Right now the content that can't wrap ends up flowing into adjacent cells and overlapping their content.

Adding the property to this selector - .list .dataobject-list li div.pad - on line 9 of dataobjectmanager.css did the trick when I was messing around in the file.

Avatar
UncleCheese

Forum Moderator, 4102 Posts

8 September 2009 at 7:19am

Which browser was doing that? For me, it always wraps to the next line. Unless, of course, it's a single word.

Avatar
JoshuaLewis

Community Member, 81 Posts

8 September 2009 at 8:07pm

It does wrap correctly but sometimes there are unexpectedly long words in narrow columns or the browser window gets shrunk to make room for another window or something.

The overlapping isn't that big of an issue but it looks bad when it happens and can hurt the users overall feeling about the quality about the admin area. Needless to say, I'm from the OCD school of design :)

Avatar
UncleCheese

Forum Moderator, 4102 Posts

9 September 2009 at 2:10am

Yeah, me too. That's part of the reason I came out with this module. Sometimes it's pretty clear that Silverstripe did not go to the OCD school. I don't know what they were thinking with that CTF interface. Looks like something I used in the computer lab at my junior high school.

Thanks for the tip. If you can confirm nothing is broken, I'll check in your CSS fix.

Avatar
JoshuaLewis

Community Member, 81 Posts

10 September 2009 at 8:06am

No nothing is broken with the text wrapping as far as I can tell.

I have done a quick test in up to date versions of Safari, IE8, Opera, and Firefox and setting overflow:hidden on the selector I pointed out earlier acts consistently.

Avatar
GustyPolo

Community Member, 9 Posts

9 October 2009 at 6:16am

Hey UncleCheese,

I'm still a newbie so I'm learning my way around silverstripe. I saw the code you posted to assign the widths, but where does that actually go? I'm piecing together parts from different secitons to create an mp3 uploader for sermons for my church and I'd like to be able to make the date width smaller than the rest.

Thanks

Go to Top