Log in

View Full Version : IE hack Problem



mikee.jk
03-26-2008, 11:06 AM
hi,

I had a question in my Interview.

"write a css for an element(image, text...) and the top margin for that element should be 20px in firefox and 50px in IE...hack it!"

I could not answer it!@#$%.

but i am interested to know the answer for it, can someone help me.

Thank you in advance!!!

codeexploiter
03-26-2008, 11:27 AM
Check the following source code


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> </title>
<style type="text/css">
.ie{
margin-top: 20px;
border: 1px solid blue;
width: 200px;
height: 200px;
}
</style>
<!--[if IE]>
<style type="text/css">
.ie{
margin-top: 50px;
border: 1px dotted red;
width: 200px;
height: 200px;
}
</style>
<![endif]-->
<script type="text/javascript">

</script>
</head>
<body>

<div class="ie"> </div>

</body>
</html>

The highlighted section will be considered only by IE. In this case you have a IE specific CSS rule which will be considered only by IE. To identify the differences I've mentioned different border color for FF and IE

molendijk
03-26-2008, 12:42 PM
Codeexploiter's solution works fine. Another possibility (if you don't worry about validation and don't mind evil code)

<style type="text/css">
.someclass{margin-top: 20px;_margin-top:50px}
</style>
---
This works because non-IE doesn't interpret the underscored part.
Arie Molendijk