SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 47

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Cross Browser Compatibility HELP!

    Hey Guys, hopefully someone can help me out. Having a bunch of problems in ie6 and ie7 and I don't know where to start fixing. http://revolveclothing.com/html/b/3....show_test.html

    This is the site, I've validated all the HTML and CSS. Just need to know what the next steps are.

    Any help is appreciated. Let me know if you need anything else from me.

  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)
    Whew, that page had some nasty bugs in it .

    Code:
    #wrap{height:auto;}
    #footer_wrap div#footer_inner ul{margin:0}
    .subnav{position:absolute;}
    #copyright{clear:both;}
    THe position:absolute; there is more of a quick fix. You position your subneav using floats and as a result it breaks the layout of the menu.

    You'd need to use position:absolute and then I'm guessing you want it like a regular dropdown? Hide it via a margin-left:-999em an dthen on hover bring it back to 0 to show it
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I made the changes and nothing happened....

  4. #4
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Got the footer looking ok, but there is some extra spacing above it and the top nav is still being pushed into 2 lines...

  5. #5
    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)
    Well if nothing happened then you are seeing a cached version of the page. The code I gave you makes the page perfect.

    Every issue you just said is fixed by my code. THe nav is because of the .subnav which I explained.

    The footer is fixed in my code as well

    If I say something fixes it then (not to sound rude) it works .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I removed the subnav completely for the meanwhile so I can get the main nav fixed. Do you know why the main nav's to last buttons are still being pushed to another line in ie6?

  7. #7
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    also do you know what would be causing that extra spacing between the footer and bottom content?

  8. #8
    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)
    Again, the navigation issue and everything else is solved with my code.

    Put the subnav back and add my code. If you say it still isn't working then leave the page be and I'll see what went wrong (Though I can show you my local copy that is working )
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  9. #9
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do you know how I would get rid of the extra spacing at the bottom of the page, above the footer?

  10. #10
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by nichob2b
    Do you know how I would get rid of the extra spacing at the bottom of the page, above the footer?
    Code CSS:
    #footer_gradient {
     
        width: 990px;
     
        background: url(../images/bottom_gradient.jpg) no-repeat;
     
        height: 87px;
     
        float: left;
     
        display: inline;
     
    }

    Code HTML4Strict:
     
    <div id="footer_gradient"></div>

    The above needs to be removed from your HTML and CSS.
    Maleika E. A. | Rockatee | Twitter | Dribbble



  11. #11
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I need that bottom gradient image, how can I still use it??

  12. #12
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by nichob2b View Post
    I need that bottom gradient image, how can I still use it??
    You can apply it to #inner_wrap.

    Something like...

    Code CSS:
    #inner_wrap {
       background:url(mygradient.png) repeat-x bottom;
       padding-bottom:84px; /* whatever value you need to make the gradient show */
    }
    Maleika E. A. | Rockatee | Twitter | Dribbble



  13. #13
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I applied it the way you suggested and now it is visible in ie6 but not firefox....

  14. #14
    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)
    Apply it to a differnet element . Make the most use out of your elements that you can.
    I'm leaving now for a couple hours but hopefully that should point you in the right direction.

    You could consider absolute positioning it if you need it
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  15. #15
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think it's displaying but on top behind the top nav....

  16. #16
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    I can hardly see the gradient on my screen so it's difficult for me to debug.

    Add "clear:both;" to your #inner_wrap and see if that works.
    Maleika E. A. | Rockatee | Twitter | Dribbble



  17. #17
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no, it didn't work. In firefox there isn't even a space for it, the bottom content is flush with the footer. But in ie it look's fine

  18. #18
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    Ok then, you can remove the clear:both. Instead contain the floats by adding "overflow:hidden" to your #inner_wrap. That should work.
    Maleika E. A. | Rockatee | Twitter | Dribbble



  19. #19
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Guys, thanks for everything. Got everything looking pretty good. I'm working my way down the site.

    I need help on the main feature slideshow. - http://revolveclothing.com/html/b/3....show_test.html ie6 is moving the text around on the main features bottom nav. Any help is appreciated.

  20. #20
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Need Help... Ie6 is displaying the features bottom nav all screwed up...



    http://revolveclothing.com/html/b/3....show_test.html

  21. #21
    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, you set too little width and thus normal browsers just let the content overflow but in IE6 it will expand the parent to fit. You can just set overflow:hidden; to fofce the width in IE. That might hide some images though, so you might want to actually do the math of those spans/images and make sure that it doesn't overflow any. The <img> I know can't have those margins set..it's just too much . Just set them on the <span>(s)
    Code:
    #showcase-nav .thumbnail{overflow:hidden;}
    Or you could take the time to lower the widths if you want

    There isn't a need to post twice. Give us/me more then 2 hours to respond..some of us have work (and in the US you're posting near dinner time anyway )
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  22. #22
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ryan,

    It did work but cut off the images like you said... How do I do the math for this
    so you might want to actually do the math of those spans/images and make sure that it doesn't overflow any
    or how would I lower the widths?

  23. #23
    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)
    Well you add up hte margins/borders/padding/width of the element. That's the total width.

    Add up both floated spans total width. Is that greater then the <a>'s (which is the parent) width? Do whatever to make sure that it is less then or equal to.

    Also remove the margins on the <img> for now, that'll make it easier for you .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  24. #24
    SitePoint Enthusiast
    Join Date
    Dec 2008
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ryan,

    Thanks man. I got everything working. I really appreciate it.

    I know I might have some more questions tomorrow.

  25. #25
    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)
    I'll be here (though I have work again, yay for next to minimum wage ). Glad everythings working .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


Tags for this Thread

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
  •