Library code snippets
CSS Positioning Within a Container
One of the best things about CSS is that you can position an object absolutely anywhere you want in the document. It's also possible (and often desirable) to position objects within a container. It's simple to do too. Simply assign the following CSS rule to the container:
#container
{
position: relative
}
Now any element within this container will be positioned relative to it. Say you had this HTML structure:
<div id="container"><div id="navigation">...</div></div>
To position the navigation exactly 30px from the left and 5px from the top of the container box, you could use these CSS commands:
#navigation
{
position: absolute;
left: 30px;
top: 5px
}
Perfect! In this particular example, you could of course also use margin: 5px 0 0 30px, but there are some cases where it's preferable to use positioning.
Related articles
Related discussion
-
Create this kind of website
by maidentv (1 replies)
-
$200 Website Design and Development
by manypeopledesign (1 replies)
-
Dallas Interactive Marketing & Internet SEO SEM October Meetup
by dsafmx (4 replies)
-
Contract: ActionScript/FlashBuilder Developer
by mattmeigs (2 replies)
-
Can I design web site by using ASP.net
by pradeepfusion (1 replies)
Related podcasts
-
Despise the listener
We have a great lineup this week: Paul talks about getting things done in web design and an alternative approach to your reading list. Marcus explains the exciting area of insurance for web designers and we have Andy Clarke on the show to give us an update on CSS 3.
This thread is for discussions of CSS Positioning Within a Container.