Seifts: Inherited: no. thanks.
Pompilio: I have a div style=”height: 100px;img style=”height: 50px;/div. How can I get the img to align in the vertical middle, so that there are 25 pixels of space above and below it? I tried “vertical-align:middle;” on both the div and the img but it doesn’t work.
Cosmo: Skcin7: image of what
Lynn: Reisio it’s a company logo
Doleman: It’s not actually 50 pixels I just said that to make it easier to explain
Stavis: I got it working using margin-top: auto; and margin-bottom: auto;, but is that the ideal way to do it? Seems weird that vertical-align: middle isn’t working.
Agramonte: It’s hosted locally. I guess i could put it on codepen or JSfiddle
Glassing: For logos that amount to wordmarks
Bergstedt: I’d just use a background image and replacement text
Gaucin: Backgrounds are easy to center
Beggs: Otherwise you could do line-height: 100px, probably
Bollozos: Reisio Here’s what it is https://jsfiddle.net/q2of2x2s/
Nigh: Yeah that logo, to me, is something I would be fine just showing up as plain text without CSS
Bemberry: So I’d just use a background image
Delaura: Well I got it vertically centered using margin-top: auto and margin-bottom auto. So weird that you have to use that and that a “vertical-align: middle” , which you’d expect to be the solution, isn’t.
Sweetland: Use an image repalcement method with an H1
Kouba: Skcin7, http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/
Geisel: Thats how you hide the text, and show an image instead
Panaro: And then just use background-position: 50% 50%;
Kamstra: To center the bg image
Hoey: Didn’t think his ego could get bigger, but look at the size of that image
Ginnery: I guess it’s just an always-mobile layout, which is funny in its own way :p
Baierl: Drej: hitting up any of the film festival?
Aills: They’re like real life except you’re just sitting in a chair
Moudry: I havent even gone to a regular movie theater in like 5 years
Mccormic: Probably says something about your quality of life :
Willardson: Its misleading, i still watch movies, but wait til they get on my tv instead
Smittle: It has potential enough :p
Vess: I think i forgot about that today
Naugle: I like it when I’m so productive I go a little hungry :
Travis: Besides, food tastes better if you’re a little hungry :p
Deliberto: Best get to it, adios!
Tako: Hey guys, i did a grid inside a canvas on top of an image
Sutt: But i think i just lost a hour
Sandholm: The canvas doesn’t resize, i need to clear and redraw every time
Wilcock: Probably did, most hours are lost
Land: Is there an easy way to have an image centered and have the excess length to extend out the left and right side of the browser window?
Huppe: Do you think that may be a div with 25 horizontal lines and 25 vertical lines all absolute positioned would be better and faster?
Eddins: Nattyrice: background-size: cover; will do that nicely
Honie: Eddins, would I have to set the image as a background property of a div instead of an image element?
Eddins: That’s how that works. If you’re using an img, you can check out ‘object-fit’ which will do something similar
Zebley: Eddins, it seems like in order for object-fit to work i need to know the width and height of the image ahead of time
Druck: I’ll keep reading about it
Eddins: Nattyrice: http://codepen.io/Eddins/pen/pjjrWx a simple example
Watral: Eddins, yep your example does exactly what I want but for some reason I can’t get it to work on my page