CODEWITHSUNDEEP
jquerycsshtmlposition
eawedat
eawedat

Reputation: 417

Setting Div's Position does not work with IE/FireFox

I have this code

I have number of issues,

first of all in FireFox 16.0.2 it does not show the second div , it also does not show the text "Hey all" in IE it yes works but it sticks divs to each others and it does not show the text "Hey all" I think Divs` positions are not set right I tried to change position by both ways jQuery/css ..

<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<style>
#11r5p6v8z9 {
position:fixed;
top:25px;
left:295px;
}

#11l6z9y3u6 {
position:fixed;
top:50px;
left:50px;
}

</style>

<script type="text/javascript">
$(document).ready(function() {

//$("#11r5p6v8z9").css({ position: "fixed", top:25px;, left:295px;});
//$("#11l6z9y3u6").css({ position: "fixed", top:25px;, left:295px;});

//$("#11r5p6v8z9").offset({ top:25px; , left:295px;});
//$("#11l6z9y3u6").offset({ top:50px; , left:50px;});


});
</script>

</head>

<body>

<div id="content">


<div id="11r5p6v8z9" style="border:1px dotted #f00;width:660px;height:410px;">
<iframe type="text/html" width="640" height="390" src="http://www.youtube.com/embed    /Af1_73K8J5g" frameborder="0">
</div>
<div id="11l6z9y3u6" style="border:1px dotted #f00;width:660px;height:410px;">
<iframe type="text/html" width="640" height="390" src="http://www.youtube.com/embed    /qjpjudx9_mU" frameborder="0">
</div>
Hey all

</div> <!-- content !-->
</body>
</html>

Upvotes: 0

Views: 395

Answers (3)

Anmol Saraf
Anmol Saraf

Reputation: 15743

Can you try changing your id names as to my understanding id's cannot start with numbers ids-cannot-start-with-a-number

Jsfiddle code with some corrections - JSFIDDLE 

$(document).ready(function() {

$("#a11r5p6v8z9").css({ position: "fixed", top:'25px', left:'295px'});
$("#a11l6z9y3u6").css({ position: "fixed", top:'25px', left:'295px'});

$("#a11r5p6v8z9").offset({ top:'25px', left:'295px'});
$("#a11l6z9y3u6").offset({ top:'50px',  left:'50px'});


});

Upvotes: 2

mplungjan
mplungjan

Reputation: 177885

You are missing the </iframe>

http://jsfiddle.net/mplungjan/FBJNY/

<div id="content">


<div id="x11r5p6v8z9" style="border:1px dotted #f00;width:660px;height:410px;">
    <iframe type="text/html" width="640" height="390" 
      src="http://www.youtube.com/embed/Af1_73K8J5g" frameborder="0"></iframe>
</div>
<div id="x11l6z9y3u6" style="border:1px dotted #f00;width:660px;height:410px;">
    <iframe type="text/html" width="640" height="390" 
      src="http://www.youtube.com/embed/qjpjudx9_mU" frameborder="0"></iframe>
</div>
Hey all

</div> ​

Upvotes: 2

CSharpConductor
CSharpConductor

Reputation: 506

ID's may not start with a number. Your CSS Rules have a number so I think that is why you are getting invalid results.

http://www.w3.org/TR/CSS21/syndata.html

Upvotes: 4

Related Questions