SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Thread: layout problem

  1. #1
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    layout problem

    hi folks. i got this page. and some how the the sidebar in left is not floating on the actual left which is right under corner of left side banner. what am i doing wrong?
    All those who wander aren't lost.

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Rather than comment on your layout strategy, I'll just suggest you change the negative top margin from 50px to 53px:

    Code:
    div.logo {
      background: url("images/logo.png") repeat scroll 0 0 transparent;
      float: left;
      height: 53px;
      margin-left: 50px;
      margin-top: -53px;
      width: 176px;
    }

  3. #3
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Rather than comment on your layout strategy, I'll just suggest you change the negative top margin from 50px to 53px:
    }[/CODE]
    what about my layout
    All those who wander aren't lost.

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    OK. For a start, place all of the header items inside the header div.

    Then create a content holder for the content area, placing the left column (and whatever goes beside it) inside that.

  5. #5
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    so what is causing that sidebar to not to be on left side?
    All those who wander aren't lost.

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,343
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Because its snagging on the logo.

    Set it to clear:both.

    Code:
    div.sidebar {
        clear: both;
        float: left;
        height: 500px;
        margin-top: 10px;
        width: 200px;
    
    
    }
    However as Ralph said you should contain those elements within your header and then make sure the header contains its floats (overflow:hidden with haslayout or use the clearfix method) and then the sidebar will automatically start on the left.


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
  •