Schmertz: Then if we go to the parent, .panorama, and set height: calc100vw * 424 / 2388; it’ll contain the image.
Wayment: Those numbers aren’t magic, it’s the dimensions of the panorama at its largest, to get the aspect of it. This way the height will always be proportionally correct, or darn close.
Poague: Now, the panorama parent element doesn’t need to be position: relative or anything, *unless* you touch top on the img itself.
Dunshie: As soon as you do that, the img will pop out of place and position itself relative to the nearest non-static parent.
Darbeau: Ok cool i am trying it out :
Eiler: The panorama parent seems to be slightly bigger than the image in this case for some reason but it’s close enough. The only bad thing about this is it’s dependent on the calc bit which uses the actual image’s dimensions.
Hesselman: AMcBain: brilliant. cheers. That worked perfectly :
Kawell: How can I align these logo’s in the middle? http://goo.gl/Gh9hPk
Kawell: So vertically and horizontally centered.
Fillerup: Kawell, uhhh, why are those background images? They look like logos and content-related references. they should be img tags.
Mabery: But seeing as they’re not, background-position: center center; would do it.
Buckovitch: Hi, how can I make it so that I can put an image on the left side of a page
Flakne: Where it fills up the entire height and then whatever space is left on the right I put in a form for registration?
Febles: And preferrably make it somewhat responsive
Wigren: Sounds like you want float or position: fixed perhaps?
Wigren: Is it a content image? if not, it’s a background, then you want background
Wigren: Background-position and background-size are probably useful
Wigren: Enter isn’t a punctuation mark
Lipsey: It’s like a webpage split it into two, th eright side is registration form
Luehring: The left side is just pretty pic
Embury: The left side just stays constant
Wigren: Is. it. _content_? that is, is the pretty picture what the user came to the page to see? would people with screen readers need to know that there is a picture there? would search engines need to know there is a picture there?
Petry: Nothing valuable there
Wigren: Then it should be a background image
Mahrenholz: Ok, but then how do I split the layout into two
Wigren: And the Enter key is still not a punctuation mark
Mattera: And make the content only start
Shuckhart: After the image has finishe
Wigren: You mean one. there’s only one thing. the other thing is a background. you use a div, you move it where you want using positioning, or margins, or floating
Heaney: Wigren: I don’t quite follow though how I would do it without using just an arbitrary value
Wigren: It’s going to be an arbitrary value no matter what. perhaps you want a percentage to cover more possibilities?
Palmerin: Dv*** # Then use this to cover the possibilities that you’ll miss, To get started with responsive designs: http://www.alistapart.com/articles/responsive-web-design/
Colace: So there isn’t a way to say ‘after end of image’ tpye thing
Wigren: Considering mobile devices, i doubt that’s what you want
Wigren: Or if you know how big the image is, then you move the other thing so it’s past the image. and since you do know how big the image is, that will work fine
Nuon: I’ll try this out, thank you.
Milward: So Wigren I’m setting the background to url which points to the image
Bannister: I’m setting it as the background of the body and making it 70%
Khn: What would be the best way to make the rest be filled with a colour?
Wigren: Set a color on the background?
Raver: Background-color? Wigren?