I have a header
height : 155px;
width : 100%;
background-repeat : no-Repeat;
background-image : url("../images/header1.png");
background-position : 0px 0px;
background-size: 100% auto !important;
/*border-bottom:1px solid #999;*/
as you can see I have the image resize according to browser size
I REALLY want this border-bottom but have commented it out because as the image height decreases then I have empty blank space within the header because the header itself is not resizing - so removing the border looks like the empty space belongs to the content area below the header.
question is how can I resize the header as the browser window changes size
I can then probably use background-size 100% 100%
max-height : 155px;
height : auto;
min-height : ???;
what would i put for min-height?
or actually what should I do here with this situation?