HTML - Image In Table Viewing Problem
Hi everyone. I am having a problem with a image within a table. The image within the table displays fine in FIREFOX, where in IE, the image does not appear. There is no red x, just the image does not appear.
Any ideas? i tried searching the forums for this problem, no luck on my end. Unless i suck at searching Quote: <table width="1000" height="30" border="1"> <tr background="RightSide.jpg"> <th width="200" height="25" scope="row"><span class="style11">Link 1 </span></th> <td width="200" height="25"><div align="center" class="style11"><strong>Link 2</strong> </div></td> <td width="200"><div align="center" class="style11"><strong>Link 3 </strong></div></td> <td width="200"><div align="center" class="style11"><strong>Link 4 </strong></div></td> <td width="200"><div align="center" class="style11"><strong>Link 5 </strong></div></td> </tr> </table> This is the table and image Similar TutorialsSo I have code that opens a file input dialog box where a person can pick an image to upload. Once an image is selected, I want the image to appear on the web page. The problem is, I dont know how to show the image, because the source is unknown. After the user selects the image from the dialog box, is there any way to show it? <input type="file" name="diagram" size="40"> <img src=( what do I put here to show the image that was selected ) align="right" style="padding-right:10px" alt="dataFlowDiagram" /> Hi there I'm new to this site but think I'll be sticking around for the wealth of information here. So...I recently designed a website for a friend working off a nice little template to save time. Everything looks great and operates exactly how they requested on a desktop browser. However, the images become vertically stretched when viewing on a mobile device pretty severely. I'm confused because it's only the photos, other graphics (also jpegs) do not become distorted. Is it because I used width="x%" and height="x%" in the image tags www.rideums.com is the website if you'd like to take a look at the source. Thanks guys for helping out. website- http://webtvdeluxe.com/home.php It's not really a problem but an annoyance. I just set up my page so it is html 4.0.1 strict. I don't have any errors or anything. Everything is viewed perfectly on a windows computer(no matter what the browser as far as I can tell). However on a mac I get this problem.... If you have a mac, use safari or firefox to view the page. At first glance, you will say "Well what's the problem?" The bottom of the middle table below fashion expert should be the bottom of the page. However the page continues further down alittle bit. If I didn't have those tables in the middle filling that empty space, the page would still be that long. For example, on one of my pages, I only have one table in the middle but my page still scrolls down right to that spot. Even if there is no content to push the table down that far which is the weird part. Has anyone ever encountered this? Is this possibly a bug with mac browsers? Is there maybe a fix? It's been a very long time since I've had to play around with HTML, and apparently it's true what they say, if you don't use it, you lose it... Anyway, I'm here with what will undoubtedly seem like a foolish question to the more experienced coders: I designed and sliced a simple little template in photoshop and was attempting to get all the sliced images formed together in a nice little table so I could put together a page... Only problem is: After I switch from a 7x2 table to a 3x2 table, I get this odd repeating line to the right... The code I'm using for this is as follows: HTML Code: <html> <title>SkateLand of Milton - Home Page</title> <body ALIGN="MIDDLE" bgcolor="#3e7600"> <table cellpadding="0" cellspacing="0"> <TR VALIGN="MIDDLE"> <TD WIDTH="47" HEIGHT="339" style="width: 47px;background-image:url(images/slice_01.png);"/></TD> <TD WIDTH="63" HEIGHT="339" style="width: 63px;background-image:url(images/slice_02.png);"/></TD> <TD WIDTH="81" HEIGHT="339" style="width: 81px;background-image:url(images/slice_03.png);"/></TD> <TD WIDTH="255" HEIGHT="339" style="width: 255px;background-image:url(images/slice_04.png);"/></TD> <TD WIDTH="72" HEIGHT="339" style="width: 72px;background-image:url(images/slice_05.png);"/></TD> <TD WIDTH="69" HEIGHT="339" style="width: 69px;background-image:url(images/slice_06.png);"/></TD> <TD WIDTH="63" HEIGHT="339" style="width: 63px;background-image:url(images/slice_07.png);"/></TD> </TR> <TR VALIGN="MIDDLE"> <TD WIDTH="47" HEIGHT="63" style="width: 47px;background-image:url(images/slice_08.png);"/></TD> <TD WIDTH="63" HEIGHT="63" style="width: 63px;background-image:url(images/slice_09.png);"/></TD> <TD WIDTH="81" HEIGHT="63" style="width: 81px;background-image:url(images/slice_10.png);"/></TD> <TD WIDTH="255" HEIGHT="63" style="width: 255px;background-image:url(images/slice_11.png);"/></TD> <TD WIDTH="72" HEIGHT="63" style="width: 72px;background-image:url(images/slice_12.png);"/></TD> <TD WIDTH="69" HEIGHT="63" style="width: 69px;background-image:url(images/slice_13.png);"/></TD> <TD WIDTH="63" HEIGHT="63" style="width: 63px;background-image:url(images/slice_14.png);"/></TD> </TR> </table> <table cellpadding="0" cellspacing="0"> <TR VALIGN="MIDDLE"> <TD WIDTH="47" HEIGHT="542" style="width: 47px;background-image:url(images/slice_15.png);"/></TD> <TD WIDTH="540" HEIGHT="542" style="width: 540px;background-image:url(images/slice_16.png);"/></TD> <TD WIDTH="81" HEIGHT="542" style="width: 81px;background-image:url(images/slice_17.png);"/></TD> </TR> <TR VALIGN="MIDDLE"> <TD WIDTH="47" HEIGHT="56" style="width: 47px;background-image:url(images/slice_18.png);"/></TD> <TD WIDTH="540" HEIGHT="56" style="width: 540px;background-image:url(images/slice_19.png);"/></TD> <TD WIDTH="81" HEIGHT="56" style="width: 81px;background-image:url(images/slice_20.png);"/></TD> </TR> </table> </body> </html> I'm kind of left scratching my head on this one... I don't really know how to solve this. Here is an image depicting the trouble I'm having: I want to make a table, consisting of many cells. These cells would be fixed, and *very different* in sizes. It's easy to make a no-space table when all the images are exactly the same size, but when you have images with a variety of sizes, the table doesn't fit perfectly. Basically I want to create a collage of images with overlay text on each image. My idea was that I could create a table, and each cell (td) would have a background which is the image. Then I could just type in that cell, so the text would be over the image. Then I'd do this for every one of my images, and a collage would be formed. The problem is, the table makes large white spaces wherever the image sizes don't match! How do I get rid of these spaces, or is there an entirely different code/approach I should be using? Thanks! Here is my current code: HTML Code: <html> <head> <style type="text/css"> table.nospace { padding: 0; margin: 0; border-collapse: collapse; } table.nospace tr { padding: 0; margin: 0; } table.nospace td { padding: 0; margin: 0; } </style> </head> <body> <TABLE class="nospace" width="2040px" height="2000px" cellspacing="0px" cellpadding="0px"> <TR> <td valign="top"> <table><tr> <TD WIDTH="800px" HEIGHT="800px" BACKGROUND="image.jpg" VALIGN="bottom"> <h1><FONT COLOR=#ffffff>text</FONT></h1> </TD></tr></table> </td> <td valign="top"> <table><tr> <TD WIDTH="700" HEIGHT="497" BACKGROUND="image" VALIGN="bottom"> <h1><FONT COLOR=#ffffff>Text</FONT></h1> </TD></tr></table> </td> <td valign="top"> <table><tr> <TD WIDTH="700" HEIGHT="467" BACKGROUND="image.jpg" VALIGN="bottom"> <h1><FONT COLOR=#ffffff>Text</FONT></h1> </TD></tr></table> </td> </TR> </TABLE> </body> </html> I am a beginner! (I thought I would warn you.) Can someone here please tell me how to do the code for being able to see how many viewers are online at a particular site. For instance so all shoppers can see how many people are shopping in that store at the same time? I hope that makes sense. Many thanks in advance!! hi this is my 1st post and i am so desperate needing help i recently did a website.. the site is viewing fine in Mac safari, windows opera and firefox.. but when comes to IE, the table is in a mess.. can someone help me? i can upload the file if possible.. below is the pictures. Opera: IE: Hey everyone Ive been working on a website for my company for some time now and Coothead has been able to help me with most everything I need Only problem is now when I go to work to view the website on a PC running Windows XP SP3 and IE 8 the dropdown menu links don't function proporly. Im not sure if its my CSS or my PHP Includes, or maybe something else hehe. my website is www.k2digitalinc.com and if it looks fine on your browser then this is a pic of what it looks on on XP IE 8 http://free.hostultra.com/~k2digitalinc/website.JPG When i hover over a link it appears below the next with no background and its impossible to click the link. Ill post my entire website script and images below, any help appreciated. I dont really understand CSS but I think its proboly a problem with the default.css file, because coothead already helped me with my php includes, so I trust he did it right Any help appreciated. Thanks. I test all of my pages on all of the most popular browsers. I believe that you can only have one version of IE installed per user account. I have IE6 running on one PC, and IE7 on another PC. Once IE8 becomes popular, I will test my pages on that too. Q. Can I have multiple versions of IE available on a single Windows XP PC? Do I need three PCs to run IE6-7-8? Q. How are you guys addressing this problem? I'm having trouble with some browsers opening my website. Some people go to the homepage and just see a blank page with the contact details at the bottom. I know the website isn't the most fancy in the world, but it's my first and does the job for now. I can view it fine. Does anyone have any ideas as to what could be wrong and how it could be fixed? My website is www.lagganoutdoor.co.uk Hope you can help. Many thanks in advance. Duncan. Hello, I am newbie, just has started my adventure with html. I tried to make an easy static site, without any additional thingd, but it occured a problem. 1. I mean, as I put table in table because I did know how to to id in different way, to make buttons on the left stay up while text on the right is moving- if I do normal table with 2columns and on the left lets say 5rows for buttons, on the right I unite all rows to make one big sort of box for contents, as I go down and try to write something morre, the rows from the letf were enlarging too If the size of explorer or firefox is nor full screen, the text in contents is going away (like now in lycos server, where screen is not full, but "cut" by advertise) 2. I have highlighted buttons, but not always works, why? (i mean it works, but darker buttons are charging so slow- maybe it is so because i saved them in pgn instead in gif, and each one is about 50kb?) -probably it is not this- because I have just changed into gif, and it is still the same 3. Another problem, as I post the site, I have notice, that in firefox I can not navigate with buttons, while in explorer yes, is it a fault of my coding, or of server where I put website? Here I post my website: http://members.lycos.co.uk/aniaacolgate/ Could someone take a look on the code, and will be so kind to correct me? It is a basic easy site of very begginger I just wanted to make a shape like this: - top: a banner - buttons in horizontal and vertical way - under buttons: contents (sincerly would like to put frames, but do not know how to put them there, is on the left there r buttons Thank you so much in advance for reply Sorry for mistakes in language Hey, I've downloaded a template to use for my webpage and i changed up the width of the middle section (in grey) within the css, it views perfectly in mozilla, but when viewed in IE it's as if i didn't widen the width of the middle section at all and as a result the text and images i have put in the area are compacted. Does anyone have any ideas of how i can get IE to view my site the same as mozilla is? Mozilla is displaying the site as i want it too look. The text is more spread out wthin the grey area. http://www.revolutionct.com.au/boot_camp_canberra.html Appreciate any help! Thanks. Hi: I'm having problems with IE viewing my site. Unfortunately a lot of my viewers still use IE, but the way the design was made (Open Source design), the right side is in the first part of the file (<div id="content">) and the left side is afterwards (<div id="left">). It was working fine in IE for a while but then just suddenly stopped working after I was editing. Not sure what I did. Site demo: www.neptuneware.com Username: gametest Password: penguins When prompted. Could anyone please look at it in IE and tell me why it's not working. All HTML is in the source code (nothing's hidden), but here is the CSS file: Code: /* ** BLUE:SKY - main stylesheet ** This CSS file makes the webpage look pretty ;-) ** ** March 5, 2006 - (version 1.0) ** ** this is a part of the open source layout by ** Jonas John (www.jonasjohn.de) ~ made for gameindicator.com ** GAMEINDICATOR.COM using OPEN SOURCE WEB DESIGN (OSWD.ORG) ** GameIndicator thanks OSWD and Jonas John for our website design. */ /* page overall: bg used to be a5ddf8 */ html * { margin: 0; padding: 0; border: 0; } body { margin: 0.5em 0em 2em 0em; font-size: 100%; font-family: "Lucida Grande", Verdana, Arial, sans-serif; line-height: 1.1em; text-align: center; background-color: #fff; background-image: url(../images/background.png); background-repeat: repeat-x; } #page { width: 1000px; text-align: left; margin-left: auto; margin-right: auto; } /* header: */ #header { position: relative; width: 100%; height: 2.8em; color: #fff; vertical-align: middle; text-align: left; } #header a:link, #header a:visited { color: #FFFFFF; text-decoration: none; font-family: "Trebuchet MS", Arial, Tahoma, sans-serif; font-weight: bold; font-size: 1.9em; letter-spacing: -0.1em !important; letter-spacing: -0.2em; line-height: 1.2em; } /* left column: */ #left { width: 24%; float: left; position: relative; font-size: 0.8em; } /* DIV NAV EXTRA ** border-right: 0.18em solid #4284B5; ** border-bottom: 0.16em solid #4284B5; */ div#nav { background-color: #fff; width: 90%; border: 1px solid #555555; } #nav ul { list-style-type: none; padding: 0.5em 0em 0.9em 0em; } #nav ul li { padding: 0.03em 0em 0.03em 0.9em; margin-right: 0.3em; } #nav a:link, #nav a:visited { color: #2E668B; } #nav a:hover, #nav a:active { color: #000; } /* LEFT BOX EXTRA ** border-right: 0.18em solid #4284B5; ** border-bottom: 0.16em solid #4284B5; */ div.left_box { background-color: #fff; width: 90%; margin-top: 1em; border: 1px solid #555555; } /* LEFT BOX AND NAV H3 EXTRA ** border-top: 0.1em solid #65B6E3; ** border-left: 0.1em solid #65B6E3; */ div.left_box h3, div#nav h3 { margin: 0em; padding: 0.2em 0em 0.2em 1em; font-size: 0.8em; color: #fff; background-color: #4284B5; text-transform: uppercase; font-family: Verdana, Arial, sans-serif; border-bottom: 1px solid #555555; } div.left_box p { margin: 0em; padding: 1em 1em 1em 1em; } div.left_box a:link { color: #2E668B; } div.left_box a:visited { color: #254A65; } div.left_box a:hover, div.left_box a:active { color: #000; } /* innerbox ** border-right: 0.15em solid #7BA5C6; ** border-bottom: 0.15em solid #7BA5C6; */ div.inner_box { } /* content column: */ /* CONTENT EXTRA ** border-right: 0.2em solid #4284B5; ** border-bottom: 0.2em solid #4284B5; */ #content { float: right; display: inline; position: relative; width: 75%; font-size: 0.75em; border: 1px solid #555555; background-color: #fff; } #content h1 { clear: both; margin: 0em 0em 0em 0em; padding: 0.5em 0em 0em 0.1em; font-size: 1.7em; font-family: "Trebuchet MS", Arial, sans-serif; color: #FF6300; border-bottom: 0.05em solid #FF9853; line-height: 1em; } #content p { margin: 0em 0em 0.5em 0em; padding: 0.35em; } /* PATH EXTRA | border-right: 0.23em solid #7BA5C6; */ #path { font-family: Verdana, Arial, sans-serif; margin: 0em 0em 0em 0em; padding: 0.4em 0.6em 0.4em 0.6em; font-size: 0.9em; color: #2F5E80; background-color: #D0E7F4; border-bottom: 1px solid #555555; } #content a:link { color: #2E668B; } #content a:visited { color: #255270; } #content a:hover, #content a:active { color: #000; } #content acronym { border-bottom: 1px dotted #4284B5; cursor: help; margin: 0; padding: 0; } /* MAIN EXTRA ** border-bottom: 0.2em solid #7BA5C6; ** border-right: 0.2em solid #7BA5C6; */ #main { padding: 0.5em 1.5em 1.5em 0.7em; } div.img_left, div.img_right { border-bottom: 0.09em solid #4284B5; border-right: 0.1em solid #4284B5; } div.img_left { float: left; margin: 0.5em 0.8em 0em 0em; } div.img_right { float: right; margin: 0.5em 0em 0em 0.8em; } div.img_left img, div.img_right img { display: block; border: 0.35em solid #7BA5C6; margin: 0; padding: 0; } /* this clears floating (e.g images) */ br.clear { clear: both; display: none; } /* footer: Margin (no spec side) used to be 0em, EXTRA padding: 0em; */ #footer { font-size: 0.6em; clear: both; color: #027BC1; text-align: right; } #footer p { margin: 0em; padding: 0.1em; } #footer a:link, #footer a:visited { color: #027BC1; } #footer a:hover, #footer a:active { color: #000000; } Alright. Hpefully you all will be able to give me a helping hand. My site is located at http://www.eternalhogwarts.com If you have an older version of I.E look at it. It looks fine. However when you view it with Firefox and IE 7.0 it looks really strange and I really don't know what to do. Please help!!! Hi all, I'm a technical author based in the UK, but I've got a problem with an online help system I'm producing - I hope you can help, I've been pulling my hair out for days trying to find a solution to this! My problem is with the security update courtesy of Microsoft and the "Page not displayed" problems it causes. The container and TOC produce fine, but the right pane shows the error. Now, my chm has to be stored on a network and will be viewed by over 500 people on terminals, so I'm unable to load anything onto any local drives, so I can't do the "Unblock" security fix. None of the users will have admin privileges and bearing in mind there are so many machines, I'm also unable to change the registry settings on the machines, so this rules out fix number two. I wonder, is there any code that could be put into the chm itself to confirm it as a valid file, and thus open directly from the network without having to modify each individual pc? Or indeed would anyone know of a script that could be run from the network to update everyone's machines all at once? If none of these work, I guess I'm reduced to producing plain HTML files, but I'm hoping I can find a workaround as I particularly like the TOC/index/search facilities of HTML help, and the fact I only have to ship a couple of files. I do hope you can help, thanks in advance, Tixuk i need the code in html when any one opens my website in mozilla firefox the user is prompted to view the website in INTERNET Explorer . while if the user opens the website in IE he is not prompted to any action. and the action required may be in pop up form or attention message form. please help me put as soon as possible. and the code must work for any browser because i need my website to be viewed in IE only. can go through the URL ... please view it in IE and firefox there is a difference is spacing the table if u can fix this or can make the prompting it will be fine http://ims-sc.org/SPORTS/members.html Hi All, Quick question, Is there anyway you can stop people viewing your source code in there browsers? by that i mean im building a website and im spending alot of time on it and i dont want people to take bits and pieces from it......im kind of answering my own question here by saying no you cant but maybe someone else has a different view? Thanks greetings all! im new to the site. and learning html css etc! my problem is. my website views fine in google chrome but when viewed in IE the pictures have gaps etc. and as my website is mostly made up of pictures. it ruins the whole thing. The site isn't centred either. which it is on chrome. ive look for hours for IE fixes but to no glory. . is there any code i can add to be compatible with IE? website is . www.malicealliance.com Thanks The following site was created with WordPress 2.8.4, using the WP Slider theme. It looks perfectly fine in Firefox but has some issues in IE7. (I'm a front end designer and have only a working knowledge of coding, so any help would be appreciated.) http://amcreativestudio.com/ Basically, the errors are with image alignment on the 'home' and 'services' page, and with no text showing up on the 'portfolio' page. I've used align="right" for the images - added this code in WP, in my theme's admin panel. I'm also using a variety of plugins, which may or may not be affected how my pages view. Help! I used the html validator add on for Firefox, and it produced the following errors on the above referenced page. line 18 column 43 - Error: document type does not allow element "span" here line 127 column 53 - Error: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag line 268 column 53 - Error: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag line 296 column 3 - Error: document type does not allow element "h2" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag line 297 column 3 - Error: document type does not allow element "h2" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag line 298 column 13 - Error: end tag for "p" omitted, but OMITTAG NO was specified line 267 - Info: start tag was here line 322 column 38 - Error: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag line 375 column 58 - Error: there is no attribute "role" |