Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

CSS & HTML: Absolute positioned element not appearing in IE

Bottom of Page

1 to 7 of 7

  1.  
    • CommentAuthormikeebee
    • CommentTimeJul 18th 2006
     permalink
    My site is workin ok in firefox but blasted IE 6 is being funny.

    1. First off is my search box isn't appearing at all (positioned absolutely)
    2. The nav on the right (13-19 year olds, are you a parent or carer etc) is 'jumping about' on hover
    3. My floated boxes under 'choose a language' on the left are spacing out odd.

    Here is the url:

    http://www.kreateagency.co.uk/~connexio/index.htm

    Any ideas would be appreciated!

    Thanks
    • CommentAuthormikeebee
    • CommentTimeJul 18th 2006
     permalink
    I've sorted number 3.. just needed to add display: inline to the <p> surrounding my links
    •  
      CommentAuthor4hero
    • CommentTimeJul 18th 2006
     permalink
    I've sorted number 2.. just need to add the margin-bottom:3px to the ul#subNav li and not the ul#subNav li a
    •  
      CommentAuthorpremii
    • CommentTimeJul 18th 2006
     permalink
    1. Apply display:block to div#searchBox.
    • CommentAuthormikeebee
    • CommentTimeJul 18th 2006
     permalink
    Number 1 still isn't showing up on explorer :(

    Number 2 worked great

    Thanks so far!
    •  
      CommentAuthor4hero
    • CommentTimeJul 18th 2006
     permalink
    don't you just love ie.. I recon it's to do with the h1 not being inside a div for some wierd reason :(

    I removed the search from inside the #outerWrapper and placed the h1 and #search inside a #header div

    <div id="header">
    <h1>Connexions Humber | Support for young people in the Humber and East Yorkshire Area</h1>
    <div id="searchBox">
    <h4>Search</h4>
    <form action="mailer.php" method="get"><input type="hidden" name="phpMyAdmin" value="4594f30712f4fabaff6997416810f3f2" />
    <p><input type="text" class="search" />
    <input type="submit" value="GO" /></p>
    </form>
    </div><!-- searchBox -->
    </div>

    with the following css

    #header {
    width:760px;
    margin:0 auto;
    position:relative
    }

    #searchBox {
    position: absolute;
    top: 120px;
    right: 10px;
    height: 51px;
    width: 157px;
    background: #E0218A url(http://www.kreateagency.co.uk/~connexio/images/searchbox-bg.gif) 0 0 no-repeat;
    padding: 18px 0 0 14px;
    }

    it works, but has added an extra div..
    • CommentAuthormikeebee
    • CommentTimeJul 19th 2006 edited
     permalink
    Thats brilliant, thanks a bunch!

    Thanks for all the help everyone

1 to 7 of 7

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page