SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Addict
    Join Date
    Sep 2001
    Location
    St. Louis, MO
    Posts
    212
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Positioning Quirks - Can't See Problem

    Hi everyone,

    Just wanted someone to take a look at a site I'm working on and see if they can help me find two quirks.

    Everything so far is pretty good on both FF and IE however there are two little things that don't look as good in IE.

    First is the search box on the upper right of the page. It stays put hugging the right corner in FF however it slides to the left when viewed with IE.

    The next issue is below the flash player there is a tabbed box. Under the 'groups' tab I can't seem to get the categories to expand the full width of the content box, again FF displays this fine and it looks much cleaner.

    http://norwichterrierdogs.com/upgrade_spota

    Thanks for any help,
    Rob

  2. #2
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    625
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    search box seems fine to me on FF3.5 and IE7.

    secondly if you want to expand your categories then you need to separate your flash div and categories div.
    at present if i expand the width of categories then your flash div also expands.

    vineet

  3. #3
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi, IE is in quirks mode due to the XML declaration above the doctype. Try removing that and see if it fixes it
    Code:
    <?xml version="1.0" encoding="utf-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb" dir="ltr" >
    <head>
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  4. #4
    SitePoint Addict
    Join Date
    Sep 2001
    Location
    St. Louis, MO
    Posts
    212
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi everyone.. thanks for the responses. I should of said in the first post that this appears to be happening on IE8. I'm not sure how the categories look in IE7 either.

    As far as what I meant about the categories is that in IE there is a good amount of whitespace to the right of the far right column within the box itself. I don't think I need to expand the box b/c it formats out nicely in FF so I know the content can fit. I'll attach a pic of IE8.

    I also tried removing the XML declaration to no avail.

    Thanks
    Attached Images Attached Images

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi, when I put it back in I can see the issue in IE however when I take it back out it's fixed . I can't see hte issue on your live page anymore now that it isn't there.

    Clear your cache. I also notice that to fix an IE6 bug you need to add float:left; to "#tp-cssmenu li a"
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  6. #6
    SitePoint Addict
    Join Date
    Sep 2001
    Location
    St. Louis, MO
    Posts
    212
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanReese View Post
    Hi, when I put it back in I can see the issue in IE however when I take it back out it's fixed . I can't see hte issue on your live page anymore now that it isn't there.
    So the page looks the same to you in IE and FF now that the XML declaration is removed? The search box is hugging the far right corner of the gradient bar it's sitting in? Are the categories in the tabbed box doing the same?

    I'm looking at it in IE7 and 8 (after clearing cache) and it's still doing the same thing.

    Quote Originally Posted by RyanReese View Post
    Clear your cache. I also notice that to fix an IE6 bug you need to add float:left; to "#tp-cssmenu li a"
    When I do this it causes a weird effect when the dropdown feature of the top menu is enabled. I'll leave it so you can see. Hover over 'Community'.

    This top menu is somewhat of a bear to me. I'd love to have the links ride the bottom of the top blue bar and have the dropdown right beneath them like you'd expect to see but there is some rollover effect that originally came with the template that I've only monkeyed with a little and can't get the desired effects.

    Thanks for taking a look

  7. #7
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Yes removing hte XML declaration makes it work on my end. If I load up your page then it is fixed, if I copy it locally (so I can test) and then add the XML delcaration (or just anything above the doctype to trigger quirks mode) then it is hugging the right side again.

    There is no dropdown on the Community Link..?

    Would you like to know where the hover effect is coming from?
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  8. #8
    SitePoint Addict
    Join Date
    Sep 2001
    Location
    St. Louis, MO
    Posts
    212
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanReese View Post
    There is no dropdown on the Community Link..?

    Would you like to know where the hover effect is coming from?
    There should be a hosed up dropdown when you hover over the 'community' link and yes I'd like to know how to eliminate the hover part and have those links ride the bottom of the blue bar.

    As you may see from the commented out .css that I've played with I was able to move the links down (I moved them back now) however when I added a sublink to any of the existing links which creates the dropdown, the sublink would appear up above the parent link and not tile downward like you'd normally see.

  9. #9
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    There is no hosed up dropdown when I hover over it, nor if I scan quickly over the source code, do I even see a dropdown for that
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •