Recently, I’ve been developping and coding a site and it’s been turning out great, everything seems to be fine, except for buttons on a particular page (50px square .pngs). I’ve coded the css for firefox, and therefore it works fine and aligns fine in this browser. With that being said, after taking a look at it in Safari, Chrome, etc, I noticed the button is off. Every image aligns fine except for the button for some odd reason (It moves to the left).
If anyone can think of why it may be doing this, or can provide a quick fix, I’d be grateful I know I haven’t provided a ton of information, but if need be, I can grab more code. I basically just need the button to move over to the right ~150px or so, whilst keeping it the same in firefox (The current code aligns it in firefox)
As Ralph said we need more code and a contert to test the code out.
Using absolute positioning without co-ordinates mens that you can never ne exactly certain where the element will end up because it is removed from teh flow at the position it would normally occupy in the floaw and that will vary of things like text-size, text-alignment and whether the line has wrapped or not or many other things.
Indeed in IE7 and under the position will be completely out if the parent has text-align center or text-align:right.
If you want accurate placement of absolute elements then set position:relative on the parent and then use co-ordinates and not margins to place them. Of course sometimes this is not possible in certain situations which is why we need to see the full code
Hey guys, thanks for the replies, I don’t have the site up and running (hosted) at the moment, but when I do I’ll be sure to post if it has not been sorted out. However, setting display: block seems to have fixed it?
I know I haven’t provided a ton of information, but if need be, I can grab more code. I basically just need the button to move over to the right ~150px or so, whilst keeping it the same in firefox (The current code aligns it in firefox)