Relative Height size with a max-height

[StephaN]

I am trying to set a height to be relative to the size of the screen (height = 12%), but I don't want it to exceed a certain pixel height (i.e. max-height: 150px). What is the proper css for this. I have tried:\[code\].titleBar { position: relative; background-color: #5C755E; padding: 1%; height: 12%; max-height: 100px; border-bottom: .45em solid #DEB887; top:0; left:0; width: 100%;}\[/code\]but this ignores the max-height property. On my large desktop screen the titlebar becomes 200px (much too big).