SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Member
    Join Date
    Sep 2010
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Pixel perfect in Chrome and Safari, but IE and Firefox trouble!!

    Hello everyone!

    I've been racking my brains on this one but can't work out what I've done (or not done)

    This page I'm working on is spot on in Chrome and Safari however in IE (8) and Firefox (3.6) my numbers and previous and next buttons are moving up slightly and therefore out of line.

    Here is a linky. http://aminternetdesign.co.uk/test/testpage.html

    Anyone got any ideas?

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, instead of absolutely positioning the Arrows, the next and previous numbers, and then the last arrow, place htem using floats. I could easily just tell you to change the margin-top to be greater on the numbers although that would be unjust of me to tell you how to do this poorly

    I'd recommend changing it to floats to get them all on the same line and not AP. Most of your site is in absolute positioning though, get away from that

    You're shooting for pixel perfection and browsers just won't give you taht with AP
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,107
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    I would suggest removing all those divs, ULs and absolute positioning within #controls, as I don't see the point of them. It looks like this would work as one line of text with links for the back and forward buttons.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  4. #4
    SitePoint Member
    Join Date
    Sep 2010
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow, thank you for such quick replies. I'll have a go at floating that lot.

  5. #5
    SitePoint Member
    Join Date
    Sep 2010
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, the float seems to have got things inline across all browsers but it's destroyed all the functionality of the number links and the previous and next. I tried to apply the classes which were originally part of the divs.

    Any idea how I can retain that functionality?

  6. #6
    SitePoint Member
    Join Date
    Sep 2010
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    this is the new version with the float and divs and ul removed.
    http://aminternetdesign.co.uk/test/testpage.html
    The links no longer work though, am I applying the classes correctly?

    Here is the original with beautifully working links and not so beautiful alignment.
    http://aminternetdesign.co.uk/test/nspcc-ie2.html

    If anyone has any ideas it'll be virtual high fives all round!

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,107
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Ah, right, the jQuery slideshow script is looking for elements and ids that no longer exit. That's a pain. (That's the problem with scripts you didn't write yourself. Not always easy to work out what they need to function.)

    I'm not sure which of those ids/elements are required by the script to make the functionality of the slideshow work. If you look through the slideshow scripts, you will be able to see the elements, classes and IDs it is looking for, and maybe will have to replace them or refashion them.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •