tjsix
Offline
• •
Upload & Sell: Off
|
 p.1 #18 · In need of CSS work, suggestions? | |
cbradio09 wrote:
Tim,
Thanks a ton! that code worked perfectly. Curiously enough, now the pictures that I reinsert at a smaller width are supposedly centered but are not centered on the background. Any idea what line of code I need to change so it centers itself on the background correctly?
Thanks,
cam
I'm not 100% sure what you're referring to but I think you're talking about the main images overflowing to the outside of the content area correct? This is happening because you've set an explicit width for the article_t, article, & article_b sections to 950 pixels, but the images you're using have a width set to 1001px. Since the image container (the article element) has an explicit width, it will not resize itself to accomodate the larger contents, as this only happens when no width is set or relative widths are being used. There are two solutions to this, the first is to use images that are sized to fit within your post content area, which using your current measurements would be a max of 906px wide (950px width - 22px of Left Padding - 22px of Right padding), OR you can put some CSS rules in place that will tell the browser to scale the images, though keep in mind each browser handles scaling differently and often times the end result is not perfect, though it can save you the headache of resizing all of the images. This also only works in modern browsers i.e. IE9+, FF, Chrome & Safari. If you want to go this route, add the following at the bottom of your style.css:
.article img {
max-width: 100%;
height: auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
|
