SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Addict Huscy's Avatar
    Join Date
    Jul 2002
    Location
    Newcastle, UK
    Posts
    318
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Remove whitespace with relative?

    Is it possible to remove the whitespace left with relative positioning without switching to absolute?

  2. #2
    100% Windoze-free earther's Avatar
    Join Date
    Feb 2003
    Location
    Linuxland
    Posts
    2,788
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's not clear what you are talking about. How about a link?

  3. #3
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Huscy
    Is it possible to remove the whitespace left with relative positioning without switching to absolute?
    No. Relative positioning keeps the space open that your element would otherwise take up, no matter where it really is. That's the nature of the spec. If you want something different, try absolute positioning or floats.

  4. #4
    SitePoint Addict Huscy's Avatar
    Join Date
    Jul 2002
    Location
    Newcastle, UK
    Posts
    318
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thing is, if i use absolutew positioning it messes up at diff res, but i cant seem to get floats to work... see my problem here --> http://infinite-fire.net/index.php?page=tutorials

  5. #5
    SitePoint Enthusiast SSKangas's Avatar
    Join Date
    Nov 2003
    Location
    Helsinki, Finland
    Posts
    54
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I took a look at your site (using Mozilla1.5) and I am not sure that I got what you are talking about. However, I had a similar problem with my site previously and you might want to take a look at the solution(s) there.

    Still, my solution isn't perfect, since IE doesn't support 'fixed' and Opera 7.23 (and earlier) messes up with 'bottom' -property (in the 'footer' div) and slashing statusbar (or so). For the best view use Netscape or Mozilla browsers.

    However, I used only xhtml and css (and php).

    P.S. Earlier versions of Opera didn't do very well (parsing)
    Sami Kangas
    E-mail: Sami@nospam-shiatsu.fi remove nospam-
    Shiatsu.fi

  6. #6
    SitePoint Addict Huscy's Avatar
    Join Date
    Jul 2002
    Location
    Newcastle, UK
    Posts
    318
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah, theres no problem if you're running 1280 * xxxx or above, which is why i kinda need to use relative, as i am NOT making a seperate stylesheet for each res (i already have a couple for diff browsers!)

  7. #7
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,
    Can you explain what you are trying to do a bit better as I'm not quite sure?

    Had a look at your site and is it the right column adds that you are talking about?

    If you want it inside the centre column but to the right you can just float it there. You will have to move the html up in the code until it is under the
    fullbox id.
    Code:
    <div class="fullbox"> 
    <div class="rightcol"> 
    	right col stuff goes here...........
    </div>
    and then use this css:
    Code:
    .rightcol {
    float: right;
    width: 120px;
    height: 610px;
    padding: 3px;
    margin-top: 2px;
    border: 3px solid #C6C6C6;
    position: relative;
    background-color: #FFFFFF;
    }
    The above will float the right column inside the white centre content box.

    If you want the right column outside the centre column then just add a negative margin to the above. But this will have the drawback of being too wide and will go off screen on smaller resolutions.

    Code:
    .rightcol {
    float: right;
    width: 120px;
    height: 610px;
    padding: 3px;
    margin-top: 2px;
    border: 3px solid #C6C6C6;
    position: relative;
    margin-right:-128px;
    background-color: #FFFFFF;
    }
    I'm not sure if this is what you meant but it might help

    Paul


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
  •