I have no idea how in the world I ever survived with just now figuring this out and many of you will laugh at me for it but to pass it on for others I wanted to explain how to position a absolute div inside of another div instead of it ending up at the top left corner of screen.
Your container Div must have the attribute of Position: Relative and your child div inside of the container will be Position:absolute... You will now be able to position it based on players screen size and such.
i know I know, silly I did not realize this before. I have been working for hours creating a dynamically built map with images, links ect all from raw JS and dynamically created CSS and it came to me on how to get it working.
Divs inside of other divs
-
hallsofvallhalla
- Site Admin
- Posts: 12026
- Joined: Wed Apr 22, 2009 11:29 pm
Re: Divs inside of other divs
Hehe works like a charm, your solution. I prefer using floats though, it is still recommended to give the parent element a position relative, but it`s not necesary, as long as the parent element is a block element.
Anyway, divs work way better then tables right? I understand you use tables quite often.
Anyway, divs work way better then tables right? I understand you use tables quite often.
-
hallsofvallhalla
- Site Admin
- Posts: 12026
- Joined: Wed Apr 22, 2009 11:29 pm
Re: Divs inside of other divs
The perfect solution is both.
Re: Divs inside of other divs
I did try telling you this many times before :p
glad you finally understand how it works halls
a quick FYI though, as far as i am aware, it works providing your parent element contains any form of positioning attribute. fixed, absolute and relative (im sure there is atleast one more, but for the life of me cant think of it without opening up DW lol)
glad you finally understand how it works halls
a quick FYI though, as far as i am aware, it works providing your parent element contains any form of positioning attribute. fixed, absolute and relative (im sure there is atleast one more, but for the life of me cant think of it without opening up DW lol)
New Site Coming Soon! Stay tuned 
-
hallsofvallhalla
- Site Admin
- Posts: 12026
- Joined: Wed Apr 22, 2009 11:29 pm
Re: Divs inside of other divs
i know we discussed it and I have always known there was a way but at the time no mention of how to do it was mentioned. This was more of discovering how to do it rather than if it can be done. But glad it is discovered.
Re: Divs inside of other divs
Hey I have been in and out for awhile but I'm back now and have been working on a game using your tutorials.
Anyway back to the topic. I have been trying to figure this out, but even after reading your description I still don't know. Could you give some example code so I can see what you mean?
Anyway back to the topic. I have been trying to figure this out, but even after reading your description I still don't know. Could you give some example code so I can see what you mean?
Re: Divs inside of other divs
Code: Select all
<body>
<div id="container" style="width:500px; height:500px; margin: 0 auto;">
<img src="star" style="position: absolute; bottom:0; right:0" />
</div>
</body>
The image has been given its position attribute and its reference points.
due to the parenting element not having a position attribute set, the image works from the upper most parent which does, in this case the document body.
this will render a result like this.
adding the attribute 'position:relative' to the parenting div, the #container, will make the img reference from that element rather than the body.
Code: Select all
<body>
<div id="container" style="width:500px; height:500px; margin: 0 auto; position:relative">
<img src="star" style="position: absolute; bottom:0; right:0" />
</div>
</body>
Hope this makes things easier to understand perry
New Site Coming Soon! Stay tuned
Re: Divs inside of other divs
Good example Torniquet! That`s exactly what`s supposed to happen
ANyway, there`s more to learn in HTML and CSS. I worked as front end developer from 05 till 08, so I have some experience in both of em. If there`s something you want to know..
ANyway, there`s more to learn in HTML and CSS. I worked as front end developer from 05 till 08, so I have some experience in both of em. If there`s something you want to know..
Re: Divs inside of other divs
Thanks It now makes perfect sense. For some reason when I was reading up on it I was under the impression that I needed to make the container absolute and the thing inside the container relative. Needless to say it was not doing what I expected, but now I understand. Thanks again.
It now makes perfect sense. For some reason when I was reading up on it I was under the impression that I needed to make the container absolute and the thing inside the container relative. Needless to say it was not doing what I expected, but now I understand. Thanks again.-
hallsofvallhalla
- Site Admin
- Posts: 12026
- Joined: Wed Apr 22, 2009 11:29 pm
Re: Divs inside of other divs
welcome back perry! we missed ya!