Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts

    absolute positioning

    how do I set absolute positioning for a span but only within the div I am in?
    without it looking to where it is the actual whole page

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    I hope I understand this right: You want to position a span absolutely but it must stay within the borders of the containing div?

    In that case you need to set position: relative for the div and then the span will be positioned according to the div's position.

  • #3
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    i want to position multiple span in 1 div all absolutely -- but in the next div again do the same thing but to that div and not to the whole page.

    so i do position:relative for the div - but what about the span? (of do I just set the pixel amount in the span?) Is there anyway to easiily measure where something would go if I have a backround image and want to fill in set places?

  • #4
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    I tried but it didn't work - I set the div to be relative and then the span to be

    .x{

    left:50px;
    top:100px;
    }

    but it just stayed in teh top corner and ignored teh postiining of the span. why?

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    Yeah of course it stayed there because that only works in conjunction with positon: absolute/relative;. You almost got ist. Just apply position: absolute; to your spans and it should work.

    In a nutshell:
    • div needs position: relative;
    • span needs position: absolute; and a specific position (top, left, right, bottom)

  • #6
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    thanks for your help -- this is what i needed to know.

    one more thing --

    if i have

    <span class=three>
    date is here<br>
    This is site info<br>
    and more

    </span>

    and the class is
    .three{
    position: relative;
    left:360px;
    top:148px

    }

    for some reason the first line of the thml is indented more then the rest.
    why?

  • #7
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    You should learn about positioning, I guess, because there are some traps that especially inexperienced people always fall for.

    Haven't read all through these sources but I think they will give you an idea:

    http://www.webreference.com/html/tutorial18/
    http://www.brainjar.com/css/positioning/default2.asp

    You probably don't need any positioning at all and should rather work with floats and margins to position your elements.

  • #8
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    I have my div with postion:relative;

    then i have a span with the css of

    .three{
    position: relative;
    left:360px;
    top:148px

    }

    but when i add text or another span to the same div. the span moves over a bit - I want it to be always positioned in the same place in the div - no matter if things are added or not? how do i do this?

  • #9
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    Make the span position: absolute;?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •