I'm stuck with a CSS issue and hoping someone knowledgeable can help.
I have a nice responsive template that I'm trying to customize with this one tweak, but I can't figure it out. My site is a photoblog and I use a single, centered column for my posts (shots with stories).
The column is about 750px wide, which is great width for reading a line of text, but I want the option of a bigger photo that goes well beyond 750. Is there a way to apply a class to an image where it would go beyond the centered column, but still stay centered on the page, and also stay within the browser window?
For example, a max-width of 1400px (uploaded as a 1400px image), centered, and also responsive to the browser window so that it is a max of 95% of the screen.
I shoot large images and want the option to display them bigger than my 750px column, which works very well for everything else. I just need to be able to have images that break those bounds and still play well with the device. As the @media scales down, the 95% width would take over to always have my image play well for the viewer.
Thanks in advance for your help! ~e