Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

beginner question, IE troubles

G

gamera~

macrumors member
Original poster
Apr 28, 2005
63
0
Boston MA
Hi all,

I am not a web dev or designer, and I don't really intend to be one; however, I've been slowly putting together a web page for my parents' business. It's nearly finished, my one big obstacle is getting it to render correctly on IE. One problem is I don't have ready access to a PC. Does anyone have tips about how to quickly get this done?

Also, any feedback on the site is welcome.
http://www.michaelhoywoodworking.com/new

thanks,
-Mike
 
Create another div for the images and make it right float. Make furniture list left float.

<div id="content">
<div id="furniturelist"> <-- make it width: xxx; float: left;
<ul>
...........
</ul>
</div><!-- end tminclude -->

<div id="image"> <-- add this, make this float:right; margin-left: xxx
<h3>
<img src="resources/misc/twochairs.jpg" alt="Two sidechairs" />
</h3>

</div>
</div>

If you don't have any other option to test in IE, go to some Internet Cafe and test it from there (unless you are willing to install BootCamp or some virtualization software and Windows)
 
tutubibi said:
if it was always h3, definitely. But using div you can wrap anything inside and still make it positioned properly. More generic ...
Click to expand...

Granted, but if you're putting an ID on the div, you're intending for it to be used only once anyway, so just put the ID on the h3 and do it that way.

If you ALWAYS intend to wrap the image in something (not exactly sure why, but it's not my site), use a class instead of an ID, and a div would be fine.

And, yes, divs are generic, but they also aren't semantic in any way. So if you can use just the image tag with a class attribute that'll do the floating, that's easier to read than an image wrapped in an h3 wrapped in a div that has a class name on it.
 
epochblue said:
Granted, but if you're putting an ID on the div, you're intending for it to be used only once anyway, so just put the ID on the h3 and do it that way.

If you ALWAYS intend to wrap the image in something (not exactly sure why, but it's not my site), use a class instead of an ID, and a div would be fine.

And, yes, divs are generic, but they also aren't semantic in any way. So if you can use just the image tag with a class attribute that'll do the floating, that's easier to read than an image wrapped in an h3 wrapped in a div that has a class name on it.
Click to expand...

You are right, class would be the right way to go. I guess my original intention was to say that any content OP wants on the right side (not only single image) would be inside such div.


zimv20 said:
http://browsershots.org/
Click to expand...

Nice find, thanks!
 
thanks, everyone, for your help. one question: was my mistake in assuming the image would render correctly, or is it due to some oddity in IE rendering? i.e. am I misusing the float attribute?
 
Firanide said:
http://dean.edwards.name/IE7/
Click to expand...

just a note. /IE7/ can be good for fixing simple issues, but for advanced stuff, or any page that will need a lot of fixes (ie lots of PNG images that have alpha transparency) it will often slow down load time dramatically, and/or introduce issues of its own.

the best solution i've found is a seperate CSS file included using conditional comments, with css/expressions to provide the necessary fixes.

i've also written a couple of js fixes for common issues (ie, a CSS-driven drop menu that needs :hover to work, and the issue of <select> boxes being rendered OVER the menu incorrectly).
 
pengu said:
just a note. /IE7/ can be good for fixing simple issues, but for advanced stuff, or any page that will need a lot of fixes (ie lots of PNG images that have alpha transparency) it will often slow down load time dramatically, and/or introduce issues of its own.

the best solution i've found is a seperate CSS file included using conditional comments, with css/expressions to provide the necessary fixes.

i've also written a couple of js fixes for common issues (ie, a CSS-driven drop menu that needs :hover to work, and the issue of <select> boxes being rendered OVER the menu incorrectly).
Click to expand...

The select box problem is a doozy - and a damn annoying one, too. It has to do with the fact that select boxes are considered windows unto themselves, and thus render above regular page elements. The only way I've been able to fix it in the past is to either hide the select, or put an iframe under the div I'm popping up. CRAZY annoying.

And good call on the conditional comments - that's almost always the recommended way to use selective CSS for IE. All those CSS hacks can be troublesome and certainly aren't future-proof. ;)
 
epochblue said:
The select box problem is a doozy - and a damn annoying one, too. It has to do with the fact that select boxes are considered windows unto themselves, and thus render above regular page elements. The only way I've been able to fix it in the past is to either hide the select, or put an iframe under the div I'm popping up. CRAZY annoying.

And good call on the conditional comments - that's almost always the recommended way to use selective CSS for IE. All those CSS hacks can be troublesome and certainly aren't future-proof. ;)
Click to expand...

yeah, thats why i wrote a js function to add the iframes to a tree of UL's. write semantic markup, then fix it when you have to.. works well with the hover fix JS i wrote.. just put a foo.hover whenever you put foo:hover and its all good. i'll be making the scrips available on my site once its back up, but i'd be happy to make them available to you guys now if you want them.
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back