When I zoomed the browser, the date and apa div went outside the container div. How to keep the date/apa div still inside the container even when zoomed? Sorry for asking simple question. Just a beginner.\[code\]<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="http://stackoverflow.com/questions/15845761/testeffect.css"/> </head> <body> <div id="header"> <div id="container"> <div id="date"> <p>18 Jamadilawal 1434H<br> Saturday, 30th March 2013<br><p> </div> <div id="apa"> <p>18 Jamadilawal 1434H<br> Saturday, 30th March 2013<br><p> </div> </div> </div> </body></html>*{margin: 0 auto;}#header{ height: 50px; width: 100%; background-color: black;}p{ font-family: Garamond; font-size: 18px; color: white;}#container{ height: 50px; width: 800px; position: absolute; left: 20%}#apa{ position: absolute; left: 200px; width: 200px; height: 50px; background-color: brown; left: 420px; }#date{ position: absolute; left: 200px; width: 200px; height: 50px; background-color: brown;}\[/code\]http://jsfiddle.net/zWpM9/