For one thing, you have #primary
set to both float: left;
style.css (line 84) and float: right;
style.css (line 177) and you have crazy margins in both places that don’t need to be there. #primary
doesn’t need any float at all. You also have conflicting rules in .left-sidebar #content
and #content
.
You can remove all of this style.css (line 177):
.left-sidebar #primary {
float: right;
margin: 0 0 0 -26.4%;
width: 100%;
}
and all of this:
#primary {
float: left;
margin: 0 -26.4% 0 0;
width: 100%;
}
and all of this:
.left-sidebar #content {
margin: 0 7.6% 0 34%;
width: 58.4%;
}
and all of this:
#content {
margin: 0 34% 0 7.6%;
width: 58.4%;
}
and just set #content to float: right;
That should fix it.
MAKE A BACKUP because I have only tested this on these two pages and these changes may affect other pages.
That worked! Thanks so much!
Okay but on:
http://marias-photos.com/pricing/
and
http://marias-photos.com/contact/
do you see how they are not lining up? is it because HTML is being used in those? I’ve tried to create test pages and they all are like http://marias-photos.com/contact/
Add a width to #content. 700px seems to work.
#content {
float: right;
width: 700px;
}