hkdalex
hkdalex

Reputation: 755

positioning a div outside another div

I have a div that is centered using margin: 0 auto; display: table;. The div is 960px wide.

There is another div inside this one. It is a search box and it is left-aligned in the top corner. But I would like this div to be left-aligned to the very left side of the browser window, meaning it would be visually outside or inside the main centered div depending on the browser window size.
Is there a way to achieve this in CSS?

Upvotes: 0

Views: 1082

Answers (2)

Merijndk
Merijndk

Reputation: 1693

here a fiddle: http://jsfiddle.net/skunheal/5qT3p/

this would be the code:

#container{
margin: 0 auto;
display: table;
width:400px;
height:300px;
background:#111;
}


#searchbox{
position:absolute;
height:20px;
width:100px;
background:#f1f1f1;
left:0px;
top:0px;
}

hope this solves your problem

Upvotes: 2

Sinister Beard
Sinister Beard

Reputation: 3680

Just use position:absolute; left:0px; on the search box. See my jsfiddl (the container ID has shrunk so that it could fit in the JsFiddle window, but the concept should be sound): http://jsfiddle.net/CQ9cc/.

Upvotes: 1

Related Questions