Getting Background to cover but not resize?


this 1 should easy 1 i'm stumped again. http://www.metrobham.org background resize on x  not repeat , not resize on y. in other words need gray aera @ top stay same height no matter size of window. want span width of page. hope explained clear enough.

 

thanks

it's or nothing cover. can't have image re-scale in 1 direction not other.  distortion horrible.

 

the best can use liquid header compatible background-color (orange) backdrop fixed-width image.   image not re-scale fill viewports header container width adjust.

 

to illustrate mean, copy & paste new, blank document.  save & preview in browsers.

 

<!doctype html> <html> <head> <meta charset="utf-8"> <title>html5, liquid header</title> <style>  body {background:#000}  header { width:100%; box-sizing:border-box; background: #facb95 url(http://www.metrobham.org/images/bg.gif) no-repeat top right; min-height: 200px; } </style> </head>  <body> <header> header text goes here... </header> </body> </html> 

 

 

 

nancy o.



More discussions in Dreamweaver support forum


adobe

Comments

Popular posts from this blog

How to set the order of FAQs instead of alphabetical

Thread: Get UK Keyboard working

how do I change the e-mail address for my merchant account