How to stretch header dynamically with changes is user screen resolution?

Hello,

On my site (www.globexposure.net/index.php) i have a blue bar (see attached) with rounded corners that sits above and below my map.

At present i have defined the header bar in my code as follows:
<div id="navigation" style="background: url('images/navigation.jpg') no-repeat; width:100%"></div>

...however, the right hand end is flat - how do i get it to fit properly so that the rounded corner is visible?

Many thanks
footer.jpg
navigation.jpg
DaniishAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
David S.Connect With a Mentor Commented:
Yes, I know that. Perhaps I should explain more: If you look at the demo of the  flexible variant ( http://www.456bereastreet.com/lab/teaser/flexible/ ) you'll see that it the technique works with a fluid width element.
0
 
David S.Commented:
I use and recommend this rounded corners technique: http://www.456bereastreet.com/archive/200406/css_teaser_box_revisited/
0
 
DaniishAuthor Commented:
Its not really the rounded corners that are the issue - but how to set the % length so that no matter what size screen resolution the bars always look the same (albeit different lengths)...
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.