I am really looking forward for the feature to be integrated into Zen.
Another thing with custom thumb sizes. Is it possible to assign certain sizes to the thumbnails, but it never gets cropped. I don't know how to explain it fully. so what I mean is it doesn't matter if the photo is portrait or landscape or even panorama format they all get the same amount of space. as in a thumbnail box around it. I am asking because I ran into the problem when having many different sized photos and turning the crop off the layout was all over the place. I hope you readers can follow what I mean. I could make a screen shot for demonstrations if needed.
You basically answered yourself with as in a thumbnail box around it. You would have to modify the CSS of your theme. The class in default theme would be "imagethumb".
Yes I have tried that before some months ago, and I have been giving it a go now as well. I just cant figure out how to get it right. have have done some changes in the album and index page to get additional information with the thumbnails. most likely that is what is bugging me the most.
As far as I can see if you want to get everything centered in horizontal and vertical way you have to change the display from block to table-cell. Then some minor tweaks from there.
`
display:table-cell;
vertical-align:middle;
` Edit:
Well that solution didnt last long, after I ran the test page through BrowserHost.
The strange thing all the IE are screwed except IE 5.01
Any takers on a solution. When Display:Block; is used the thumb do not align vertically. Vertical-align:middle; only seems to work on when display mode is on table-cell.
http://www.cvilledecor.com/check.html Go to that page and look at the code... it works in ie 6 and 7 as well as other browsers. Vertical align middle is not the solution. If you want to create a div and have it be a set it to a fixed height, this will place any content centered. Maybe this will work for you.
A possible solution to center content vertically and horizontally is this, but I mostly used it to center complete fixed sites in the middle of the browser window (isn't `vertical-align: middle` for tables only anyway?):
I am having problems getting ether of the last 2 suggestions to work.
@eddiejanzer As far as I can tell using tables for this is kind of off. As you want to get a line of thumbnails. I had a look at the example. Maybe you could give an example code that works for zen. And you say that `Vertical-Alignment` is not the solution yet the code you send me has it in it just with a different name `` .
@acrylian And isn't `position: absolute;` off as well, as far as i can tell that will place all the thumbs in the same position, all on top of each with the placement they get assigned in the code.
And yes `vertical-align: middle;` is for tables is what I later found out. However Firefox and Safari can use it anywhere for normal use. IE can't do that. Except IE 5.01 as far as I can tell.
Yes, you are right, `postition: absolute`will not work in this case. Was mainly loud thinking. This is the only technique for centering both that I know right now.
I have been researching this on the internet for some days now. I have just not been able to to this for Internet Explorer. There is a lot of things we can do with programing but not being able to do something simple like Aligning an item Vertically in situation like this just beats me up. Are there any other people out there that have tried doing this?
Comments
Another thing with custom thumb sizes. Is it possible to assign certain sizes to the thumbnails, but it never gets cropped. I don't know how to explain it fully. so what I mean is it doesn't matter if the photo is portrait or landscape or even panorama format they all get the same amount of space. as in a thumbnail box around it. I am asking because I ran into the problem when having many different sized photos and turning the crop off the layout was all over the place. I hope you readers can follow what I mean. I could make a screen shot for demonstrations if needed.
As far as I can see if you want to get everything centered in horizontal and vertical way you have to change the display from block to table-cell. Then some minor tweaks from there.
`
display:table-cell;
vertical-align:middle;
`
Edit:
Well that solution didnt last long, after I ran the test page through BrowserHost.
Screenshots here from BrowserHost.
http://www.olihar.com/junk/080329-215854-olihar.com-678888/
The strange thing all the IE are screwed except IE 5.01
Any takers on a solution. When Display:Block; is used the thumb do not align vertically. Vertical-align:middle; only seems to work on when display mode is on table-cell.
Go to that page and look at the code... it works in ie 6 and 7 as well as other browsers. Vertical align middle is not the solution. If you want to create a div and have it be a set it to a fixed height, this will place any content centered. Maybe this will work for you.
`position: absolute;
left: 50%;
width: 550px;
margin-left: -275px;
top: 50%;
height: 550px;`
@eddiejanzer
As far as I can tell using tables for this is kind of off. As you want to get a line of thumbnails. I had a look at the example. Maybe you could give an example code that works for zen. And you say that `Vertical-Alignment` is not the solution yet the code you send me has it in it just with a different name `` .
@acrylian
And isn't `position: absolute;` off as well, as far as i can tell that will place all the thumbs in the same position, all on top of each with the placement they get assigned in the code.
And yes `vertical-align: middle;` is for tables is what I later found out. However Firefox and Safari can use it anywhere for normal use. IE can't do that. Except IE 5.01 as far as I can tell.