Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
phem. ie7 compatibility issue
Old 05-11-2007, 01:36 PM phem. ie7 compatibility issue
Y-aji's Avatar
Skilled Talker

Posts: 53
Name: Keith
Trades: 0
I know i know, always with the ie7 questions.
i am working on a school website (have been on and off all year)
and am finally tuning it to close to how i think they want it w/o it being overbearing.

http://www.clinton.k12.mo.us/website

anyway, my question is regarding ie7:
I am working with min and max widths. whenever i set them up in my float,
it causes my left margin (in red) to scoot over about 220px, and leaves the background transparent, so you can see the background set for the page. None of the other browsers are having a problem with this, it's just ie7.

#float {
width: 90%;
min-width: 760px;
max-width: 1024px;
margin: auto;
margin-top: 32px;
margin-bottom: 32px;
border: 2px solid #000000;
overflow: hidden;
}


this is driving me nuts, because this is basically the final problem before i can launch the website.

thanks much, and if you need more information, let me know. sorry if im not making sense, let me know and i will try to rewrite it.
Y-aji is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 06-08-2007, 12:31 PM Re: phem. ie7 compatibility issue
Y-aji's Avatar
Skilled Talker

Posts: 53
Name: Keith
Trades: 0
I thought i'd put a response to how i fixed this for people with the same problem. I ended up just using a javascript that told ie7 that made it understand min and max widths and heights:

minmax.js -

// minmax.js: make IE5+/Win support CSS min/max-width/height
// version 1.0, 08-Aug-2003
// written by Andrew Clover <and@doxdesk.com>, use freely

/*@cc_on
@if (@_win32 && @_jscript_version>4)

var minmax_elements;

minmax_props= new Array(
new Array('min-width', 'minWidth'),
new Array('max-width', 'maxWidth'),
new Array('min-height','minHeight'),
new Array('max-height','maxHeight')
);

// Binding. Called on all new elements. If <body>, initialise; check all
// elements for minmax properties

function minmax_bind(el) {
var i, em, ms;
var st= el.style, cs= el.currentStyle;

if (minmax_elements==window.undefined) {
// initialise when body element has turned up, but only on IE
if (!document.body || !document.body.currentStyle) return;
minmax_elements= new Array();
window.attachEvent('onresize', minmax_delayout);
// make font size listener
em= document.createElement('div');
em.setAttribute('id', 'minmax_em');
em.style.position= 'absolute'; em.style.visibility= 'hidden';
em.style.fontSize= 'xx-large'; em.style.height= '5em';
em.style.top='-5em'; em.style.left= '0';
if (em.style.setExpression) {
em.style.setExpression('width', 'minmax_checkFont()');
document.body.insertBefore(em, document.body.firstChild);
}
}

// transform hyphenated properties the browser has not caught to camelCase
for (i= minmax_props.length; i-->0; )
if (cs[minmax_props[i][0]])
st[minmax_props[i][1]]= cs[minmax_props[i][0]];
// add element with properties to list, store optimal size values
for (i= minmax_props.length; i-->0; ) {
ms= cs[minmax_props[i][1]];
if (ms && ms!='auto' && ms!='none' && ms!='0' && ms!='') {
st.minmaxWidth= cs.width; st.minmaxHeight= cs.height;
minmax_elements[minmax_elements.length]= el;
// will need a layout later
minmax_delayout();
break;
} }
}

// check for font size changes

var minmax_fontsize= 0;
function minmax_checkFont() {
var fs= document.getElementById('minmax_em').offsetHeight;
if (minmax_fontsize!=fs && minmax_fontsize!=0)
minmax_delayout();
minmax_fontsize= fs;
return '5em';
}

// Layout. Called after window and font size-change. Go through elements we
// picked out earlier and set their size to the minimum, maximum and optimum,
// choosing whichever is appropriate

// Request re-layout at next available moment
var minmax_delaying= false;
function minmax_delayout() {
if (minmax_delaying) return;
minmax_delaying= true;
window.setTimeout(minmax_layout, 0);
}

function minmax_stopdelaying() {
minmax_delaying= false;
}

function minmax_layout() {
window.setTimeout(minmax_stopdelaying, 100);
var i, el, st, cs, optimal, inrange;
for (i= minmax_elements.length; i-->0; ) {
el= minmax_elements[i]; st= el.style; cs= el.currentStyle;

// horizontal size bounding
st.width= st.minmaxWidth; optimal= el.offsetWidth;
inrange= true;
if (inrange && cs.minWidth && cs.minWidth!='0' && cs.minWidth!='auto' && cs.minWidth!='') {
st.width= cs.minWidth;
inrange= (el.offsetWidth<optimal);
}
if (inrange && cs.maxWidth && cs.maxWidth!='none' && cs.maxWidth!='auto' && cs.maxWidth!='') {
st.width= cs.maxWidth;
inrange= (el.offsetWidth>optimal);
}
if (inrange) st.width= st.minmaxWidth;

// vertical size bounding
st.height= st.minmaxHeight; optimal= el.offsetHeight;
inrange= true;
if (inrange && cs.minHeight && cs.minHeight!='0' && cs.minHeight!='auto' && cs.minHeight!='') {
st.height= cs.minHeight;
inrange= (el.offsetHeight<optimal);
}
if (inrange && cs.maxHeight && cs.maxHeight!='none' && cs.maxHeight!='auto' && cs.maxHeight!='') {
st.height= cs.maxHeight;
inrange= (el.offsetHeight>optimal);
}
if (inrange) st.height= st.minmaxHeight;
}
}

// Scanning. Check document every so often until it has finished loading. Do
// nothing until <body> arrives, then call main init. Pass any new elements
// found on each scan to be bound

var minmax_SCANDELAY= 500;

function minmax_scan() {
var el;
for (var i= 0; i<document.all.length; i++) {
el= document.all[i];
if (!el.minmax_bound) {
el.minmax_bound= true;
minmax_bind(el);
} }
}

var minmax_scanner;
function minmax_stop() {
window.clearInterval(minmax_scanner);
minmax_scan();
}

minmax_scan();
minmax_scanner= window.setInterval(minmax_scan, minmax_SCANDELAY);
window.attachEvent('onload', minmax_stop);

@end @*/
Y-aji is offline
Reply With Quote
View Public Profile
 
Old 06-12-2007, 04:54 PM Re: phem. ie7 compatibility issue
LadynRed's Avatar
Defies a Status

Posts: 10,016
Location: Tennessee
Trades: 0
IE 7 supports min and max width (and height), that 'solution' should not be necessary.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

LadynRed is offline
Reply With Quote
View Public Profile
 
Reply     « Reply to phem. ie7 compatibility issue
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.12698 seconds with 12 queries