Same HTML code works for some images and not others - html

I'm writing a simple website and cannot seem to figure out a small problem. Whenever I insert an image (all images are in an Images subfolder) I use the exact same image code. However, for some reason some of the images show up as broken links when I put the website on a server and access it that way. I access the exact same place from the server locally and the images look just fine. When accessed from the server through the internet only the first image in the table shows up. I know the files are not corrupted and every other reference throughout the website works just fine. Any thoughts?
Edit: The permissions are the same for every image in the folder. Read/Execute on all files.
<div id="headshots">
<table>
<thead>
<tr>
<th colspan="4" style="text-align:center">THE TEAM</th>
</tr>
</thead>
<tr>
<td><img src="Images/Example0.jpg" alt="****" /></td>
<td><img src="Images/Example1.jpg" alt="****" /></td>
<td><img src="Images/Example2.jpg" alt="****" /></td>
<td><img src="Images/Example3.jpg" alt="****" /></td>
</tr>
<tr>
<td style="text-align:center; color:white" bgcolor="#C59353">Example0</td>
<td style="text-align:center; color:white" bgcolor="#C59353">Example1</td>
<td style="text-align:center; color:white" bgcolor="#C59353">Example2</td>
<td style="text-align:center; color:white" bgcolor="#C59353">Example3</td>
</tr>
</table>
</div>

I am assuming that the main difference here is that locally you're using Windows while your server is using Linux. The main thing to look out for in Linux vs. Windows is case-sensitivity. Say, if one of your images is named example1.jpg or Example1.JPG, it will not work with your code.
I am almost certain that this is the solution to your problem, although it's actually more of a guess, so if you have additional information please post it here.

Related

Phantom Showing up in my page

I have a page written in HTML/ASP that has a series of nested tables that I use for formatting the page the way I want it.
When the page loads however there is a white space between the two tables that is not in the code and when I inspect it in chrome it shows the code has a &nbsp character between them.
Why is this appearing in the page when it loads but it is not in the script? How can I remove it?
<table width=100% border=2 cellpadding=0>
<tr>
<table width=100%>
<tr>
<th width=10% align="right">Destination:</th>
<td width=60%>Here</td>
<td width=10% align="right">Date:</td>
<td width=20% align="left"> <%=FormatDateTime(d,2)%></td>
</tr>
</table>
</tr>
<tr>
<table width = 100%>
<tr>
<td width=2%> </td>
<td align="right">Time1:</td>
<td align="center"><%=formatTime(oRS1("time"))%></td>
<td><%=oRS1("location")%></td>
<td width=40> </td>
<td align="right">Driver</td>
<td> <%=fpn%></td>
</tr>
<tr>
</table>
I just had this same issue and here are the steps that I tried that eventually fixed it:
Cleared the cache in the browser
Cleared all browser data
Tried a different browser
None of the above worked in my case, and the phantom was not in my code (and I triple checked it!!!!), but it was obviously somewhere since it was showing in the console and other browsers:
So, (and this may not be the best way to solve this but it worked) as you can see from my console output, I added two paragraph tags above and two below (by carefully putting the cursor in front of the next element and using a carriage return and the arrow key to go back up) to get the phantom in the middle. After that I saved it, then proceeded to select and delete the two paragraph tags in the middle together (with the phantom between them). This is what finally worked, the delete of both the elements surrounding it together took the phantom with it...
Perhaps some small part of my html page became corrupted? Who knows... but if anyone else is having this issue, give this a try.

Different width on Chrome and Firefox on same screen

recently I find that new version of firefox is show width, significantly different from chrome
this is my table which show completely different in fire fox and chrome . Is there any idea for this case?
<table id="headtable" class=" tahoma">
<tr>
<td width="84">نام سرور</td>
<td width="62">CPU</td>
<td width="46">RAM</td>
<td width="34" class="tool-tip">نوع هارد دیسک </td>
<td width="79">فضا</td>
<td width="43" class="tool-tip">پهنای باند </td>
<td width="46" class="tool-tip">ترافیک ماهیانه </td>
<td width="59">دیتا سنتر</td>
<td width="69" class="tool-tip">کنترل پنل </td>
<td width="47" class="tool-tip">هزینه‌ی راه اندازی </td>
<td width="54">هزینه‌ی ماهیانه</td>
</tr>
</table>
<div class="hole" id="hole">
<table id="panels-compare" class="tahoma compare panels">
<tr>
<td width="66">ایران۷</td>
<td width="62">Xeon 3430</td>
<td width="46">۸ گیگابایت</td>
<td width="58">SATA</td>
<td width="81">2x500GB</td>
<td width="43">۱۰۰ مگابیت</td>
<td width="46">۱۰۰ گیگابایت</td>
<td width="59">پارس‌آنلاین / افرانت</td>
<td width="69">DirectAdmin</td>
<td width="46">۵۰,۰۰۰</td>
<td width="54">۳۵۰,۰۰۰</td>
<td width="">سفارش</td>
</tr>
</table>
</div>
Weird. That can't be the code for the image as displayed, so I'm going to take a guess... Maybe you missed a column, it looks like some are the same size and others are not. Or, maybe the sum of the td widths is greater than one if its containing elements, and the browsers are responding to the invalid state differently. Similarly, it may be that invalid html elsewhere on the page is behind this - if all else fails, ensure your markup is valid.
It all depends on the "clutter" a browser has.
Google chrome has "clean" UI, it doesn't take up too much space for its address bar, bookmark bar etc..
Whereas Mozilla too has its own way of displaying things.
So there is no standard that defines how much screen a browser should use for address bar, bookmarks bar, home button, back-front buttons, tabs etc..
So just leave it as there is not much you can do other than what you've already done to have a uniform size.

Some thumbnails are not showing up?

I have a website with thumbnails that link to pictures in a new tab. For whatever reason some of them work and some of them don't. Is this most likely a problem with my schools web server? I'll link the code here as well as the website.
Here is the website
If you scroll down to the second part of this photo gallery you will notice that some of these thumbnails are not working and when you click them the full image does not show up either. Using filezilla I copy and pasted from my PC into the server all at once. So I feel like there may be something I'm missing in the code. At the same time however the code is exactly the same except with different names so I have no idea whats going on. If you see any coding issues please let me know otherwise I will just assume it is a problem with the schools web server.
And here is some of the code.
<tr>
<td><img src="images/tn_quiltexample1.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample2.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample3.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample4.jpg" alt="Quilt Example"></td>
</tr>
<tr>
<td><img src="images/tn_quiltexample5.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample6.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample7.jpg" alt="Quilt Example"></td>
<td><img src="images/tn_quiltexample8.jpg" alt="Quilt Example"></td>
</tr>
From the code I linked. Quiltexample 3, 4, and 5 are not showing up.
Your 3 images that are missing have uppercase file extensions and the web server being used is configured to respect case sensitivity.
These urls work:
http://rnissen.myweb.usf.edu/images/quiltexample3.JPG
http://rnissen.myweb.usf.edu/images/quiltexample4.JPG
http://rnissen.myweb.usf.edu/images/quiltexample5.JPG
You can also just access them without the extension.
http://rnissen.myweb.usf.edu/images/quiltexample3
http://rnissen.myweb.usf.edu/images/quiltexample4
http://rnissen.myweb.usf.edu/images/quiltexample5

Can't connect to remote server from FireFox but works in IE & Chrome

I have some html to connect to server's(Remote server path's) like this
<TABLE BORDER="5" WIDTH="90%" CELLPADDING="4" CELLSPACING="3">
<TR>
<TH COLSPAN="2"><BR><H4><Font color=GREEN><b>CIT</b></FONT></H4></TH>
</TR>
<TR>
<TH COLSPAN="2">123</TH>
<TH></TH>
</TR>
<TR ALIGN="CENTER">
<TD COLSPAN="2"><a href=http://123.abc.com/apps>Eformer</a></TD>
</TR>
<TR ALIGN="CENTER">
<TD><a href=http://123.abc.com/apps/way>Gateway - PULSE</a></TD>
<TD><a href=http://123.abc.com/apps/gate>Gateway - HONDA</a></TD>
</TR>
<TR ALIGN="CENTER">
<TD><a href=http://123.abc.com/apps/mm>Fax - PULSE</a></TD>
<TD><a href=http://123.abc.com/apps/mn>Fax - HONDA</a></TD>
</TR>
<TR ALIGN="CENTER">
<TD><a href=http://123.abc.com/apps/pulse>TYPE - PULSE</a></TD>
</TR>
<TR ALIGN="CENTER">
<TD><a href=http://123.abc.com/apps/xy>POST - PULSE</a></TD>
<TD><a href=http://123.abc.com/apps/yz>POST - HONDA</a></TD>
</TR>
<TR ALIGN="CENTER">
<TD><a href=http://123.abc.com/apps/ss>Agent - PULSE</a></TD>
</TR>
</TABLE>
This works in IE & Chrome but doesn't work in Firefox. Can someone extend their kind help to work out?
Finally,i've found it. There is variation in format to work in firefox.We need to include 5 forward slashes to work in firefox.Here is the example
Eformer
For our example it should be formatted as -
<TD>POST - PULSE</TD>
<TD>POST - HONDA</TD>
where 123 is server name and no need to specify domain(abc.com) in our above example.
This works in all IE,Chrome & Firefox browswers.
Links in href must be enclosed in "" as
Read more about using links here. Also link url must not be broken on server end.
All mentioned browsers are capable of handling invalid HTML and opening your links in an appropriate manner. link is one of the oldest HTML tags and core functionality of HTML and works even if you are using very old versions of browsers.
As a good analyist, there must be something different going wrong; I can imagine 3 cases:
You are using a missconfigured proxy (from school or business) which has a problem with your paths.
Your browser(s) openes the url correct, but your server redirects to a different (wrong/unexpected) path due to missconfiguration
You have installed a firewall / antivirus / proxy / plugin which changes the URI in the HTTP request to something unexpected
Good luck on your mission Mr. Hunt. This message will self destruct in 5, ..4, ...3, ...

How do make a profile table?

I am trying to get this table on my site to have an image on the left and information about the staff member on the left. It is in a WordPress page but regardless of weather it's on the page or in a standalone HTML document it doesn't seem to render the way I want it to.
It's supposed to follow the same general idea as http://grab.by/djQk.
I attempted to copy their source but couldn't get it to render so I pulled their source from my site and started from scratch and still couldn't get it working.
http://radio.powercastmedia.net/staff/
I have implemented what you need using CSS instead of tables.
See this JSFiddle
Cheers, Sam
If you're using tables....
<table>
<tr>
<td style="width: 25%;">
<img src="blah"/>
</td>
<td>
<table>
<tr>
<td>Blah</td>
<td>Blah</td>
</tr>
<tr>
<td>Blah</td>
<td>Blah</td>
</tr>
</table>
<td>
</tr>
</table>
Note: the problem with your pastebin example is that you're using <tr> inside a <td> which is incorrect - <tr> can only go inside a table so you need additional table tags.
It's also possible to do with a single table using colspan and rowspan on individual cells, but I'd personally prefer to do it by making the image a float left eg:
<div>
<img src="blah" style="float: left;"/>
<p>Name: John</p>
<p>Something else</p>
</div>