Can’t Figure Out Why My Layout Breaks

[k_mcminn]

Hello, everyone!

I’m having a difficult time trying to figure out why my layout is breaking when I adjust a few CSS classes. Specifically, in this page:
http://goo.gl/AJjpR

If I adjust:
#content, .main_width {
width: 975px;
}

to:
#content, .main_width {
width: 990px;
}

…that works just fine.

If I adjust this:
.ipsLayout_content {
float: left;
width: 100%;
}

to:
.ipsLayout_content {
float: left;
width: 685px;
}

…it breaks

If I make those changes on [this page](http://goo.gl/MIbqX “this page”), for example, everything works fine. I know I’m missing something simple, just can’t track it down. I have a feeling I’m missing a clearfix somewhere.

Any help is greatly appreciated!

[devil3682116]

This may nt be the solution but may work

.ipsLayout_content {
width: 685px;
float: right;
}

[k_mcminn]

Thank you for the quick response. While that works, I’m hoping that I don’t have to do it like that. I’d rather have it work the same way as the other page I referenced. If I have to adjust something to achieve that, I will. I hope that makes sense?

[wolfcry911]

Look closely at the markup. On the page with problems the .ipsLayout_content class is used both for the left column _and_ for the container of both columns. Obviously if you try to set the container to the width of only the left column, it won’t be wide enough for both.

[k_mcminn]

You spotted it, wolfcry911! Let me see if I can fix that real quick. Just so you know, I’m having a difficult time trying to so bear with me.

[k_mcminn]

wolfcry911! I managed to figure it out. It was tricky, but I did it! Thanks for pointing me in the right direction. And, thanks devil3682116 for assisting as well. Have a great weekend, everyone!

[Author]

Posts