hoachen
05-11-2006, 09:07 PM
Hi guys, I have been searching this forum for div positioning for hours but still can't find what I need. I create a webpage that have a table with three column. First column is picture , second column is description text and sames third column. The table I align in center <table align=center width="800" cellspacing="0" cellpadding="0"> I use few div tags inside the picture and want them in a specific position. When I use 1024 X768 is look fine in IE but when I use 1280X768 screen resolutions the text will move to different position. Can anyone tell me how to make it have the same position nor matter what screen resolution is.
#specials {
position:absolute;
left:44px;
top:267px;
width:66px;
height:4px;
z-index:14;
}
<div class="link style2" id="specials">Specials</div>
Googled
05-12-2006, 02:48 PM
Hi,
you'll have to use javascript to position this div.
1- Find the screen resolution
2- Then some simple math calculation
3- Div positionning
function position() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
}
else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
}
else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
// here myWidth & myHeight have the body size of the user which ever browser he's using
// here you should do your calculations.
// here you're repositionning the div object.
// replace 'somevar' by your calculations.
s = document.getElementById('your_div_id_name').style;
s.left = somevar+'px';
s.top = somevar+'px';
s.width = somevar+'px';
s.height = somevar+'px';
}
This code is not complete but should help you find your answer quite easily.
Regards,
G
hoachen
05-12-2006, 04:14 PM
Thank you very much for your help and code. I will try it when i get home.
Thanks again and have a wonderful day.
Hi,
you'll have to use javascript to position this div.
1- Find the screen resolution
2- Then some simple math calculation
3- Div positionning
function position() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
}
else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
}
else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
// here myWidth & myHeight have the body size of the user which ever browser he's using
// here you should do your calculations.
// here you're repositionning the div object.
// replace 'somevar' by your calculations.
s = document.getElementById('your_div_id_name').style;
s.left = somevar+'px';
s.top = somevar+'px';
s.width = somevar+'px';
s.height = somevar+'px';
}
This code is not complete but should help you find your answer quite easily.
Regards,
G