Not mixing px with %

[stockton]

I have been given an application to maintain and it includes an external style sheet part of which is shown below:-

#SlotsWindow {
    position:absolute;
    width:47%;
    height:80%;
    top: 125px;
    left: 120px;
    overflow: hidden;
}

I have been given to understand that mixing percentages with px is bad practice but I do not understand how I can easily translate the above px to percentages.

Suggestions please.

[Xurion]

If you have an element that is 200px wide and another element inside it at 80%, it is pretty obvious that with little calculation the 80% wide element will be 160px.

 

Bear this in mind when trying to convert from % to px.

[haku]

Depending on what you are using the px for, there is nothing wrong with mixing px and either %s or ems. Percentages are static, and as such will not change when either the browser is resized, or the font size is increased/decreased. This can be a good thing for margins and/or padding sometimes, as they will make your site expand or contract a little more gracefully by remaining static. The example you gave is one such example. The element in question will always remain 125 pix from the top and 120 from the left regardless of how the browser is resized.

 

That being said, those numbers seem a little big, and there is a good chance that its not the best coding for the site. Without seeing the site and the rest of the code, it's hard to say.

[stockton]

The site is at http://www.stockton.co.za/LeaderBoard