html - Positioning text within a width:100% (liquid?) header and footer elements -


some background: every site build based on using center container div see on screen contained within, example, 1000px wide container. nothing left or right , no top or bottom bars extend off left or right sides of screen. it's time build site top , bottom bars expand out past 1000px container div. got part, right down bars themselves.

the problem: want position text (links exact) within top , bottom bars, not dissimilar how looks here. i'm getting messed because want without absolute positioning, or js or jq or via plugin. when add div contain text within, say, top bar, sits happily left of top bar, not want it. have searched, researched , made small attempts figure out no avail.

therefore: built sample site includes image if how things look. site bare minimum on html , css (hopefully) make things clear, , can found here.

add css:

#top_content {   margin: 0 auto;   width: 1000px; } 

this make text within <div id="top_content">here</div> align main 1000px container while <div id="topbar"> still expands 100% of browser width.

do same footer, giving inner div , targeting css give auto left/right margins , 1000px width centers under main #content container.


Comments

Popular posts from this blog

how to proxy from https to http with lighttpd -

android - Automated my builds -

python - Flask migration error -