Jump to content

Removing part of an html moves everything over 6px? CSS problem I believe?


daytona10
 Share

Recommended Posts

Take a look at the code first, HTML:

<div id="center"><div id="center-left"><img src="images/front-pg.png"/> <div class="p-left"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et sodales nibh. Sed facilisis sodales nulla ac vestibulum. Aliquam mi leo, sagittis ut suscipit ac, fringilla in velit. Phasellus dignissim lectus quis augue venenatis fringilla. Aenean elementum, diam vel lobortis malesuada, ipsum libero ultricies tellus, in lobortis augue purus non velit. Duis lectus augue, ultricies eu iaculis vitae, ultricies a risus. In dolor lorem, aliquam at viverra ut, tempor a tortor.</p></div><div class="p-right"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam et sodales nibh. Sed facilisis sodales nulla ac vestibulum. Aliquam mi leo, sagittis ut suscipit ac, fringilla in velit. Phasellus dignissim lectus quis augue venenatis fringilla. Aenean elementum, diam vel lobortis malesuada, ipsum libero ultricies tellus, in lobortis augue purus non velit. Duis lectus augue, ultricies eu iaculis vitae, ultricies a risus. In dolor lorem, aliquam at viverra ut, tempor a tortor.</p></div> </div></div>

CSS:

#center {width: 960px;background: white;overflow: hidden;}float: left;}#center-left {width: 640px;float: left;background: green;}#center-left h1 {padding-left: 45px;padding-right: 45px;font-size: 30px;color: #556279;}#center-left img {margin: 45px 45px;background: pink;}.p-left , .p-right {width: 275px;float: left;padding-top: 20px;}.p-left {margin-left: 45px;}.p-left p , .p-right p {width: 250px;font-size: 16px;color: #556279;} 

basically the #center tag is the main content for this page, on one page within the #center tag theres two column (#center-left, and #center-right) total width is 960px. I created another page with a similar set up but instead of the columns i deleted everything within the "center" tag and I expected the whole thing to be the same, well it is, but it shifts everything on the page 6px over to the right. I deleted the whole #center-right without problems, but when I deleted p-left and the image, it shifts that whole page 6px over. did I mess up somewhere in the css? Any Ideas?

Edited by daytona10
Link to comment
Share on other sites

Solved it... Apparently this is an osx lion problem. With the introduction of the new scroll bars (which are 6px wide) if a page does is not big enough for scrolling, the side bar disapears..moving things to the right..by 6 pixels. :D

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...