- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › CSS › display: table-cell causing firefox and opera to ignore max-width and max-height properties
If you would please go to http://debourg-dev.ch/syselcloud/erp-rh/ you will see that in firefox and opera the images are not using the max-height property. This is because I’m using display:table-cell to vertically align them, if I remove display: table-cell it works fine. How can I vertically align these images with display: table-cell and get firefox and opera to make use of the correct max-height value?
The concerned code is:
.partenaire-logo-wrap {
height: 110px;
text-align: center;
vertical-align: middle;
display: table-cell;
}
.partenaire-logo-wrap img {
max-height: 90px;
}
Thanks
I think you can reduce the amount of markup and simplify things.
http://codepen.io/wolfcry911/pen/Dnczo
you could set the anchor to display: block with a height and line-height of 90px (which will vertically align the images). No need for wrapping divs or extra classes. Note also, there’s no extra classes on the anchors, img, etc.
Edit// this post has been edited a couple of times. Thank-you to Paulie for the first fix (the original post attempted code blocks). I changed it a bit further to clarify (there were two code blocks originally).
F this F’n markdown! I think Chris has done his forum community a great disservice with his latest theme makeover.
arron118, I apologize, but I can’t be bothered to fix the preceding post. Maybe a forum mod can correct things for you to see.
I don’t post code here for the very reason you mentioned.
I just stick it in Codepen.
_Post updated with CP link._