Image not resizing in IE, Can't get things to work correctly |
Image not resizing in IE, Can't get things to work correctly |
Reedly |
Mar 4 2009, 01:29 PM
Post
#1
|
Group: Members Posts: 5 Joined: 4-March 09 Member No.: 7,962 |
Hello all - first post here at WDG.
I'm having trouble with an image resizing in IE(7). I have created the following website: My Webpage. If you open the site in Google Chrome, or Firefox, the main image in the middle (Portfolio) section resizes to a percentage of the table, depending on the browser size. Better explained -- If you resize your browser by dragging the edges, the image would resize accordingly. I've done this by mixing html code with CSS, (which I'm incredibly new at.) It appears I've done something wrong, as IE won't resize the image correctly. Below is the horrible 'mixed' up code that should create the image resizing. Could someone please help me with the correct way to code this for IE, FF, and Chrome CODE <div style="width: 95%;" align="center"><font class="white"><font size="3"><b>Clockwork Pictures:</b></font></font></div> <div style="width: 99%;"> <p> <img name="mainimage" src="clockwork_sample1.jpg" style="width: 95%; border:7px solid #222222;" title="Clockwork Pictures sample image" alt="Clockwork Pictures sample image"></p> </div> <div style="width: 95%" align="left"> <p> <font class="white">Additional page views: <a href="java script:changeImage('clockwork_sample1.jpg')" class="grey"><font size="3">1</font></a> <a href="java script:changeImage('clockwork_sample2.jpg')" class="grey"><font size="3">2</font></a> <a href="java script:changeImage('clockwork_sample3.jpg')" class="grey"><font size="3">3</font></a><br> View Website: <a href="http://www.clockworkpictures.net" class="blue" target="_blank">www.ClockworkPictures.net</a></font></p> </div> <div style="width: 95%" align="justify"> <p><font class="grey">Vestibulum pede ante, tincidunt ac, imperdiet dignissim, mattis vel, dui. Cras nunc. Fusce eu turpis. Aenean tincidunt lorem ac dolor. Quisque ut magna ac arcu aliquet malesuada. Quisque sagittis elit vitae est consectetur fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</font></p> </div> |
Reedly |
Mar 4 2009, 02:10 PM
Post
#2
|
Group: Members Posts: 5 Joined: 4-March 09 Member No.: 7,962 |
I just realized that if I plug the above code into it's own html page, it works correctly in Internet Explorer. But when it's within the actual site code, it doesn't work correctly, only in IE.
Strange. Is it something to do with the <div> inside the table? |
pandy |
Mar 4 2009, 02:41 PM
Post
#3
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,716 Joined: 9-August 06 Member No.: 6 |
I'd say it has to do with the code you don't show us together with the code you do show us. URL to the whole thingamajig?
|
Reedly |
Mar 4 2009, 02:54 PM
Post
#4
|
Group: Members Posts: 5 Joined: 4-March 09 Member No.: 7,962 |
Pandy, thanks for the reply. I also agree that it must be something in the table layout...but I can't figure it out yet. Oh, and I posted a link to the full site in my first post.
Thanks for taking a look at it! |
pandy |
Mar 4 2009, 04:31 PM
Post
#5
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,716 Joined: 9-August 06 Member No.: 6 |
Sorry, I tend to miss the URLs lately.
It's because the whole thing is wrapped in a table. I'm not sure how this works, but I think IE refuses to make the table smaller than the image's real width, so both the table and the image stop shrinking there. You can see this if you wrap a simple one cell table around the sample code, the one that works on its own. In a way I find this to be the more logic approach. The table's width depends on the width of its content and the width of the content depends on the width of the table - that sounds like it shouldn't work. |
Reedly |
Mar 4 2009, 04:34 PM
Post
#6
|
Group: Members Posts: 5 Joined: 4-March 09 Member No.: 7,962 |
Hmmm...I guess that means I need to drop the tables completely somehow and go CSS, but that's beyond me at this point. I wonder why it works in FF and Google?
Can you, or anyone else think of any possible IE workaround for making an image resize to a percentage within a table? Thanks Pandy for the update!! |
Lo-Fi Version | Time is now: 29th March 2024 - 05:54 AM |