SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    div positioning in IE7

    hI, i am looking for help with an issue in IE7.

    the alignment of certain elements are not right and have moved position.

    it works fine in IE8 and FF.

    i have just taken on this job so i am unclear how they have implemented the code etc. i think the code is filtered from our main website.

    i am looking for advice on what the problem may be with the positioning and the solution.

    this is the link to the page

    Get Your Business Found by More People

    I apologise if i am being vague

    thanks
    forry1

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    Hi,

    Welcome to Sitepoint

    That code is a bit of a nightmare to work with all the inline styles, however you may be able to fix the header by changing the inline-block style to float left instead.

    Here:
    Code:
    <div id="brighton_header"> <span class="logo"><a style="display: inline-block;float:left; border: medium none;" href="http://www.brightfire.co.uk"><img src=
    Add float:left as shown above.

    Note that span class="logo cannot be a span as spans cannot hold block elements. It should be a div.

  3. #3
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi, thanks for the help. i will give it a go.

    Can you tell me why the footer elements are out of alignment aswell.
    is this caused by the top nav moving position.

    thanks again

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    The footer is incorrect because you haven't adjusted the default left margin on the uls. The inline styles only remove left-padding and only some browsers use a default of left-padding while others use left margin.

    As you have no class or wrapper on those elements you will need to either add a parent class and address the uls within or just set all uls to zero.

    e.g.
    Code:
    ul {margin-left:0}
    Or write the inline styles for every ul in that section.

    Code:
            <ul style="color: rgb(152, 152, 152); list-style: none outside none; padding-left: 0pt;margin-left:0">

  5. #5
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    excellent.

    I will give that a shot.

    Appreciate your help with this.

    have a good day

    cheers


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
  •