I’d suggest you start by setting a min-height that is equal to the height of your largest image. So something like:
.home .comic {min-height:350px}
in style.css should do it.
I tried that, and used a min-height of 450 so I could really tell if it was working. But it didn’t do anything. I should mention I am using inkblot theme and editing the style.css in the inkblot-child folder. Any other ideas?
Thanks.
Did you remember to press CTRL and F5 simultaneously when viewing the updated page? Or try emptying your browser cache? This should ensure that your web browser fetches a fresh copy of the page rather than serving up an out-dated copy from your own cache.
I can’t see the CSS I suggested on the site.
I tried the code, and it didn’t work. I did ctrl+F5 to clear cache while refreshing and it did not work. The code is currently commented out in the css file. I’ll re-enable it and try again, since I am on a different computer.
The code is back in, and enabled. Please let me know if it works on your end. It would be surprising, since it does not work over here in Chrome or Firefox, after clearing both browser caches. Thanks.
You’re right. It needs tweaking. Try:
.home .comic objct {min-height:450px}
I was able to get it with:
.home .comic .object {min-height:450px}
This only affects the front page, so I also added a line under that with
.single .comic .object {min-height:450px}
This got it to 450px height on all the single comic pages! Thank you very much for the help, now I will just figure out what height I actually want it to be! 😀
I have one more question, now that it’s a specific height. How would I align the comics down to the middle of that box? The first thing I tried was putting vertical-align:middle; into the final snippets of code above. I also tried:
.home .comic { vertical-align: middle; }
and
.home .object { vertical-align: middle; }
and even
.home { vertical-align: middle; }
I’m pretty sure the vertical-align is what I’m supposed to use, I just don’t know what class it should be tied to. Unless I’m wrong on both counts. Let me know.
Are you using the Add Media option to insert the comic? If so, simply selecting “Center” for 2Alignment” should centre the image for you.
I am not. The Webcomic plugin has a separate box that it uses for inserting “comics” into the post. This is why I’m thinking I’ll have to add it to the CSS itself.
