Cross Browser HTML Problem - Web Development Discussion Boards

Here are some usefull PHP sites
www.phpbuddy.com
http://php.net
www.thenewboston.org

Sarfaraz

How about PHP.net.

If you mean Parents Helping Parents, then HERE YOU GO[^]!

"we must lose precision to make significant statements about complex systems."
-deKorvin on uncertainty

Google[^]

Neonlight

With a simple search you could find almost 100 websites about PHP.
I guess the best website about PHP is PHP.NET
http://ir.php.net/manual/en/index.php[^]

Good starter: http://www.php.net/[^] At least the printer-friendly manuals are awesome.

Vasudevan Deepak Kumar
Personal Homepage
Tech Gossips

The woods are lovely, dark and deep,
But I have promises to keep,
And miles to go before I sleep,
And miles to go before I sleep!

Hi I want to ask if there is a way to export html sting to word document with html formatting and word page break

Here is what I am trying to do

I am trying to export mail template written in html format and is customized with customers data to word document to be printed and send to them so I need each copy of mail to be on separate page

for now I can only export data to word but it is written as plain text with html tags

any help please

thank you

I have been assigned an intranet project at work and I am having a very hard time finding a way to make my alignment work across browsers. The alignment looks as expected in IE but terrible in Firefox or Chrome etc... I thought that one of you guys that do this all the time might have a easy explanation.
Here is my HTML
In advance I am sorry for the huge post but I have no idea what part is causing the problem...
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="frmTroubleTicket.aspx.vb" Inherits="FSIntranet._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>First Step-Intranet</title>
<script type="text/javascript">
function sLostFocus(fld)
{
fld.className = 'normal';
}

function sGotFocus(fld)
{
fld.className = 'focus';
}
</script>
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="frmTrouble" runat="server">
<table id="table1" border = "0">
<tr>
<td>
 </td>
<td>
<img alt="First Step Logo" src="FS%20logo.JPG" width="35%" />
</td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<p style="font-size:16px;">Click <a href="//10.10.10.2/training">HERE</a> for the Training
Folder</p></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<hr /></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<p class="bText">Experiencing
PC Problems ? Let us help...</td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
Please fill out the following form detailing the problems you are experiencing.</td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<table>
<tr>
<td style="width:20%" style="text-align:right;">Your Name:</td>
<td style="text-align:left;">
<asp:TextBox ID="txtName" runat="server" Width="350px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">
&nbsp
</td>
</tr>
<tr>
<td style="width:20%" style="text-align:right;">Your Location:</td>
<td style="text-align:left;">
<asp:TextBox ID="txtLocation" runat="server" Width="350px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">

</td>
</tr>
<tr>
<td colspan="2">
Nature of PC Problem(s):
</td>
</tr>
<tr>
<td colspan="2">

<asp:TextBox ID="txtProblem" runat="server" Height="183px" TextMode="MultiLine"
Width="475px"></asp:TextBox>

</td>
</tr>
<tr>
<td style="width:20%" style="text-align:right;">Email:</td>
<td style="text-align:left;">
<asp:TextBox ID="txtEmail" runat="server" Width="350px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">
&nbsp
</td>
</tr>
<tr>
<td style="width:20%" style="text-align:right;">Phone Number:</td>
<td style="text-align:left;">
<asp:TextBox ID="txtPhone" runat="server" Width="350px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">
&nbsp
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="btnSubmit" runat="server" Text="Submit" Width="120px"
Height="32px" />
&nbsp
<asp:Button ID="btnReset" runat="server" Text="Reset" Width="120px"
Height="32px" />
</td>
</tr>
</table>
</td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<hr /></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
Copyright © 2009 First Step Inc.</td>
<td>
 </td>
</tr>
</table>
</form>
</body>
</html>

I haven't tested your code, but it's a pretty safe bet to say that your layout relies on some of the rendering errors in IE to look as you expect. The page is actually rendered correctly in Firefox.

When building a cross browser layout you should build it for a browser that is not IE, after that you can tweak it to circumvent the rendering errors in IE.

So, I am afraid that the reason that the page doesn't look like you want in all the non-IE browsers is that the code simply is wrong, and there is no easy way around that.

Despite everything, the person most likely to be fooling you next is yourself.

Thank you for your response, but any help as to why this is happening would be much appreciated. A friend of mine mentioned that the colspan may have something to do with the display problems, if this is the case any suggestions as the correct way of doing this?
Thank you in advance.

Humble Programmer

I don't know how you want it to look, really. When I try the code in IE7, it looks rather messy. As you pasted the ASP.NET markup code instead of the generated html code, and as I don't have the style sheet that you use, I can't really test it reliably. Do you have the page hosted somewhere where it's possible to test it?

Despite everything, the person most likely to be fooling you next is yourself.

I am sorry for posting the ASP I was not thinking you would not really be able to use that... I am wanting everything to center to the middle regardless of the screen resolution, browser etc. This looks correct in IE as I have said but not any of the other browsers. Here is the HTML and Css.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>

</title>
<script type="text/javascript">
function sLostFocus(fld)
{
fld.className = 'normal';
}

function sGotFocus(fld)
{
fld.className = 'focus';
}
</script>
<link href="styles.css" rel="stylesheet" type="text/css" /></head>
<body>
<form name="frmTrouble" method="post" action="frmTroubleTicket.aspx" id="frmTrouble">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTM1NjkyODgwNw9kFgICAw9kFgoCAQ8PZBYEHgdvbkZvY3VzBRBzR290Rm9jdXModGhpcyk7HgZvbkJsdXIFEXNMb3N0Rm9jdXModGhpcyk7ZAIDDw9kFgQfAAUQc0dvdEZvY3VzKHRoaXMpOx8BBRFzTG9zdEZvY3VzKHRoaXMpO2QCBQ8PZBYEHwAFEHNHb3RGb2N1cyh0aGlzKTsfAQURc0xvc3RGb2N1cyh0aGlzKTtkAgcPD2QWBB8ABRBzR290Rm9jdXModGhpcyk7HwEFEXNMb3N0Rm9jdXModGhpcyk7ZAIJDw9kFgQfAAUQc0dvdEZvY3VzKHRoaXMpOx8BBRFzTG9zdEZvY3VzKHRoaXMpO2RkWHdUoG9ul8hkqb+GaYpJXv7dDmY=" />

</div>

<div>

<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWCAKHz9r/DQLEhISFCwKV6YbiAQLDhIbeBAKE8/26DALEku2wCALCi9reAwKgt7D9CtwCmlCdneJzxcAseivLc9yIQ8eR" />
</div>
<table id="table1" border = "0">
<tr>
<td>
 </td>
<td>

<img alt="First Step Logo" src="FS%20logo.JPG" width="35%" />
</td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>

<p style="font-size:16px;">Click <a href="//10.10.10.2/training">HERE</a> for the Training
Folder</p></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>

<td>
<hr /></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>

<p class="bText">Experiencing
PC Problems ? Let us help...</a></td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>

 </td>
<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
Please fill out the following form detailing the problems you are experiencing.</td>

<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
<table>
<tr>

<td style="width:20%" style="text-align:right;">Your Name:</td>
<td style="text-align:left;">
<input name="txtName" type="text" id="txtName" onFocus="sGotFocus(this);" onBlur="sLostFocus(this);" style="width:350px;" />
</td>
</tr>
<tr>
<td colspan="2">
&nbsp

</td>
</tr>
<tr>
<td style="width:20%" style="text-align:right;">Your Location:</td>
<td style="text-align:left;">
<input name="txtLocation" type="text" id="txtLocation" onFocus="sGotFocus(this);" onBlur="sLostFocus(this);" style="width:350px;" />
</td>
</tr>

<tr>
<td colspan="2">

</td>
</tr>
<tr>
<td colspan="2">
Nature of PC Problem(s):
</td>
</tr>

<tr>
<td colspan="2">

<textarea name="txtProblem" rows="2" cols="20" id="txtProblem" onFocus="sGotFocus(this);" onBlur="sLostFocus(this);" style="height:183px;width:475px;"></textarea>

</td>
</tr>
<tr>
<td style="width:20%" style="text-align:right;">Email:</td>
<td style="text-align:left;">

<input name="txtEmail" type="text" id="txtEmail" onFocus="sGotFocus(this);" onBlur="sLostFocus(this);" style="width:350px;" />
</td>
</tr>
<tr>
<td colspan="2">
&nbsp
</td>
</tr>
<tr>

<td style="width:20%" style="text-align:right;">Phone Number:</td>
<td style="text-align:left;">
<input name="txtPhone" type="text" id="txtPhone" onFocus="sGotFocus(this);" onBlur="sLostFocus(this);" style="width:350px;" />
</td>
</tr>
<tr>
<td colspan="2">
&nbsp
</td>

</tr>
<tr>
<td colspan="2">
<input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" style="height:32px;width:120px;" />
&nbsp
<input type="submit" name="btnReset" value="Reset" id="btnReset" style="height:32px;width:120px;" />
</td>
</tr>
</table>
</td>

<td>
 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>

 </td>
</tr>
<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>

</tr>
<tr>
<td>
 </td>
<td>
<hr /></td>
<td>
 </td>
</tr>

<tr>
<td>
 </td>
<td>
 </td>
<td>
 </td>
</tr>
<tr>

<td>
 </td>
<td>
Copyright © 2009 First Step Inc.</td>
<td>
 </td>
</tr>
</table>
</form>

</body>
</html>

body
{
text-align:center
}

table
{
width:60%;
}
a
{
color:#0000CC;
text-decoration:none;
}

a:hover
{
font-weight:bold;
}

p.bText
{
color:#666666;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
.normal
{
background-color: #FFFFFF;
}
.focus
{
background-color: #FFFF00;
}

Humble Programmer

Surely someone has an answer to this, I would really appreciate ANY help... Confused | :confused:

Humble Programmer

Change the CSS definitions below:

body {
  width: 60%;
  margin-left:  auto;
  margin-right: auto;
  text-align:center;
}

table {
  width:  100%;
}

I was curious why you put DIV tags around the hidden input elements. That seems pointless.

Don't let my name fool you. That's my job.

I am tasked with migrating our organization’s static website to a more dynamic one with plans for several web applications for our users. I plan on using jquery[^]as my js foundation.

Our users are various school districts which may have a variety of browsers and a variety of security policies, meaning that browser and capability may be dictated by an IT dept and not the user.

Can someone recommend a good example of browser capabilities detection? I’d really like to get a good idea of the browser demographics we’ll be serving before we start developing.

I saw BrowserHawk[^]) which looks incredible. Does anyone have experience with this?

Anyone have other suggestions?

Anything free? (I only ask the free question because it’s easier to start developing when I don’t have to get budget approval. I’m not looking for a free lunch. Smile | :)

)

Thanks!
Matt Penner

Browserhawk gets alot of its functionality from background Java files, therefore Javascript is lacking.

Either use JQuery.browser and make do with that or This JQuery plugin[^] or use Google Analytics[^] for free which is always good Big Grin | :-D

although Google Analytics isn't in real time.

hmmm pie

modified on Wednesday, March 4, 2009 1:48 PM

Thanks for the reply!

What do you mean when you say Javascript is lacking?

I do like how BH shows various things like Javascript enabled (not just supported), flash version, Silverlight version (not a requirement though), XMLHttpRequest, file upload, DHTML, ConnectionSpeed, GZip, PNG, browser dimensions, SSL, etc.

So, it's more of browser capability than simply browser detection.

I do like Google Analytics, and I will be using it for tracking, but they don't go into real depth on capabilities.

I suppose I could recreate much of this using jquery on my own but I thought I'd ask before I spent time on it. Plus, if it has been done before and is freely available chances are it will be better than my first implementation.

Thanks!

Javascript alone doesn't return alot of the functionality that BH has as most of it is returned by the background Java, is what I was trying to say, sorry it was badly worded.

hmmm pie

modified on Wednesday, March 4, 2009 2:28 PM

I'd recommend to use a JavaScript library that gracefully degrades with browser capabilities (like jQuery) and not rely on Flash, Java, or SilverLight. If you do need to use one of those technologies, the Flash is probably the way to go, though you should pay attention to the last point below.

Also, make sure that you support varying levels of CSS compliance.

Finally, make sure that if you're in the US that it complies with Section 508[^]. If your Web applications don't comply, some school districts won't use it because of federally mandated restrictions.

"we must lose precision to make significant statements about complex systems."
-deKorvin on uncertainty

Thanks. Good points. I'm planning on standardizing on CSS and jQuery. I don't plan on Flash (I'm not a Flash developer) and I don't plan on Silverlight simply because of the requriement for IT admins to install the client.

Since this is strictly an "internal" app (loosely meaning that I have a very defined set of specific users, not for public use) I am interested in the ability of my pool of users.

Thanks for info about the varying levels of CSS support.

Also, thanks for the info on Sec508. While my current project is for defined business staff I don't think this applies. however, as we begin to offer more and more public info on our site this will be something we need to take into account.

Great stuff!
Matt

I'm glad I could help.

I work primarily with the Yahoo! User Interface JavaScript and CSS library. I really like it. You can find more information about it at YUI[^].

"we must lose precision to make significant statements about complex systems."
-deKorvin on uncertainty

Hi Guys,

I am using ASP.Net 2.0 GridView control with more than 4,000 records. In one webform I used 4 views with 1 GridView each. One of these Views has a GridView with more than 4,000 records. And I am also using a repeater. But it is just really frustrating, because it is really very slow. When I clicked the AutoEdit(Edit link) for the 800th record it will postback and I need to find that 800th record again and start changing the cell values, which is not good. Same thing when I clicked Cancel. And by the way, I am using UpdatePanel and no paging method will be used in GridView as part of the client's standards. And also my GridView is inside the Panel control so that there's a Vertical Scroll bar, and it's easier for the user to see all the records from top to bottom using vertical scroll bar.

The following ASP.Net controls I am currently using in this process are:

Multiview, View, Panel, GridView, SqlDataSource, Repeater, UpdatePanel

Structure/Hierarchy:

Multiview1

-----View1
----------Panel1
---------------GridView1(with 100 records)

-----View2
----------Panel2
---------------GridView2(with 150 records)

-----View3
----------Panel3
---------------GridView3(with 50 records)

-----View4
----------Panel4
---------------GridView4(with 4000plus records)

Questions:

1.) How can I load the Page/Gridview fast with more than 4,000 records without using paging method?
2.) How can retain the position when editing a particular row?

I really stumped with this.

Any recommendation?

hifiger2004

modified on Wednesday, March 4, 2009 10:34 AM

Hi all,

I have an app that is written to support IE 6 and 7.

One mod that I made to it a couple of years ago was to capture the keystrokes via the

document.onkeydown = keyhandler_function;

and then interpreting the window.event.keyCode and performing functionality depending on the key that was entered.

This all worked well and good for over 18 months until someone noticed that there was one circumstance where clicking on a certain control in the document appears to cause the document to lose focus. This means that until I mouse click back in the document someplace, none of my keystrokes are intercepted by the onkeydown redirect.

I have tried debugging this in IE using the script debugger. All I can see from there is that my code doesn't even appear to get control again.

Does anyone have suggestions (aside from dumping ie and getting a real browser like ff Wink | ;)

) on what I can do to figure out what is happening?

I would really appreciate any help that would be offered.

Thanks,

Doug

hi all
I have a BHO program which tracks visitors on websites
what is the best way to collect the data and send it to my database ? (cookies, AJAX, XML, other )

hey there. kinda new to this only been coding for about 8 months using basic asp and got set a task by a friend to build a chat client using .asp and ajax and javascripts. im trying to refresh the page using something other than meta refresh. the click is annoying people (if you going to point out to me im going agenst the user knowing the page is updating bla bla bla, please go annoy some one else as ive already read about it). i would like a way to update the page with out the click or a flicker. i call the chat information from a database which stores all the chat messages. any ideas would be helpful.

thanks
p.s please keep it simple for me as im new to coding

PETVAMPIRE - NEWBIE