HTML - Browser Detection

Hi,

I work on a Mac, and have Safari, Internet Explorer 5 and Firefox.

1. What do you think I should be building my sites to? What do you use?
2. Also why do some sites work in all browsers? CSS hacks?


Microsoft are no longer letting you download Internet Explorer for the Mac, from microsoft.com. Therefore all new mac users from February last year will not be using Explorer.

Please help!
Thankyou
Tom

Working on it now. Thanks.

Hey HTML Forum!!

So im gettingr really frustrated with this problem I'm having with this HTML issue. I did all of the coding in dream weaver(Yea by coding I mean drag and drop )Everything looks great opened up in dream weaver. Then when I open it in a browser (IE and Firefox) everything is all chopped up. check this out. First shot is in DW, second shot is opened in IE:





What do you guys think? This is only the second website I have done and havnt had much formal training so im kind of flying by the seat of my pants. Thanks in advance!!!

EDIT: You can actually go to the home page and see how bad it looks. www.miattconstruction.com the home page isnt AS bad but go to project or contacts and the pages get worse.

I was wondering on the board's opinion. Basically, the ALTtext element used in image display, provides two things:

1. Replacement text if the image should be abscent so that you can easily reference which image is missing and replace it.

2. Mouseover text of the image so surfers can get short extra information about the image.

Now, you may argue that a Browser should come set as default to ignore mouseover text. However, there is a reason why many web developers still use this in preference to an image title.

The reason being that it is extra programming for the developer to type out additional code which merely plays the same role as the original Alt attribute.

Some argue that the programmer shouldn't even give an Alt value! Sadly, in turn many browsers are unfortunately becoming designed without the Alt text attribute, making many Alt-text-specific sites hard to understand.

If you honestly find a small bit of mouseover text which really only exists for a fraction of a second intrusive of your surfing time then you've got issues.

Who agrees?

Ok my runescape site looks fine in Mozilla and IE6, but I have two members using IE7 that are getting this:

http://img341.imageshack.us/my.php?image=rsguidegw1.jpg

Just wondering what the "hack" is for IE7 to get this to align right.

The site is as follows:

http://rse.pzproductions.com

The CSS is:

Code:

body {
background-color: #5a5a5a;
color: #ffffff;
margin: 0;
padding: 0;
font-family: trebuchet ms, arial, verdana, helvetica, georgia;
font-size: 10pt;
height: 100%;
}

#wrapper {
width: 100%;
min-height: 100%;
margin: auto;
position: relative;
}

* html #wrapper {
background-image: url(images/navbg.gif);
background-repeat: repeat-y;
height: 100%;
}

#navheadwrap {
margin: 0;
padding: 0;
float: left;
height: 100%;
position: fixed;
background-image: url(images/navbg.gif);
background-repeat: repeat-y;
width: 200px;
}

* html #navheadwrap {
position: relative;
}

#head {
background-image: url(images/rsenewtitle1.gif);
background-repeat: no-repeat;
margin: 0;
padding-bottom: 15px;
width: 200px;
height: 200px;
z-index: 2;
}

#navigation {
width: 200px;
height: 100%;
margin: 0;
padding: 0;
z-index: 1;
position: absolute;
margin-top: -50px;
}

* html #navigation {
position: relative;
}

#navigation h3 {
margin: 0 0 10px 10px;
color: #000;
font-size: 14pt;
display: inline;
font-family: papyrus, "trebuchet ms", tahoma, georgia;
}

#navigation ul {
display: inline;
list-style-type: none;
}

#navigation a, #navigation a:visited, #navigation a:active {
color: #17486A;
padding: 5px 3px 0px 15px;
display: block;
text-decoration: none;
width: 85%;
font-size: 11pt;
}

#navigation a:hover {
color: #17486A;
padding: 5px 3px 0px 15px;
display: block;
text-decoration: underline;
width: 85%;
font-size: 11pt;
}

#navigation li.title {
font-size: 12pt;
font-weight: bold;
border-bottom: 1px dashed #000000;
width: 85%;
color: #000000;
margin: 0px auto 0px 10px;
text-align: left;
font-family: papyrus, tahoma, georgia;
}

* html #navigation li.title {
width: 75%;
}

#content {
position: relative;
margin-left: 200px;
padding: 10px 10px 10px 0;
height: 100%;
}

.adminsig {
font-weight: bold;
color: yellow;
}

#content a, #content a:visited, #content a:active {color: #DBA206;}
#content a:hover {text-decoration: none;}

.paragraph {
padding-left: 10px;
padding-right: 10px;
text-align: justify;
}

#content ul {
list-style-type: none;
}

#content h2.orange {
color: #DBA206;
font-family: papyrus, "trebuchet ms", tahoma, georgia;
display: inline;
}

#content h3 {
color: #429AD7;
font-family: papyrus, "trebuchet ms", tahoma, georgia;
display: inline;
}

.newstitle {
font-size: 11pt;
font-weight: bold;
font-family: "trebuchet ms", arial, verdana;
border-bottom: 1px solid #000000;
width: 100%;
color: #429ad7;
}

.border {
border: 1px solid white;
}

#goal {
border-bottom: 1px solid #000000;
color: #eeeeee;
padding: 0px 0px 3px 20px;
margin: 0;
}

#goal a, #goal a:visited, #goal a:active {color: #DBA206;}
#goal a:hover {text-decoration: none;}

#goal h3 {
color: #dba206;
font-family: papyrus, "trebuchet ms", tahoma, georgia;
display: inline;
}

#goal h4.progress {
color: #FF0000;
}

#goal h4.deadline {
color: #0BDF00;
}

#goal h4 {
color: #429AD7;
font-family: papyrus, "trebuchet ms", tahoma, georgia;
display: inline;
}

/* Block Menu */

#ul-table li a {
background-color:#1A4766;
font: 10pt "trebuchet ms", Arial, sans-serif;
display:block;
line-height:30px;
}
#ul-table a:link, #ul-table a:visited, #ul-table a:active {
color: #ffffff; text-decoration: none;
}
#ul-table a:hover {
background-color:#1E6799;
color: #ffffff;
text-decoration: underline;
}
#ul-table {
width: 505px;
text-align:center;
margin: 0px auto;
padding:0;
color: navy;
list-style-type:none;
clear:both;
}
#ul-table li {
width: 125px;
float:left;
border:1px solid black;
border-right:none;
text-align: center;
}
* html #ul-table li a {
width: 100%;
}
#ul-table li.top {
border-bottom:none;
}
#ul-table li.right {
border-right:1px solid #000000;
}
#ul-table li.nolink {
font-weight: bold;
background-color: #D0AE78;
color: black;
}
.clear {
clear:both;
margin-top:-1px;
height:1px;
overflow:hidden;
}

/* End Block Menu */

/* Small Block Menu */

#skills td a {
font: 10pt "trebuchet ms", Arial, sans-serif;
display:block;
line-height:30px;
}
#skills a:link, #skills a:visited, #skills a:active {
color: #ffffff; text-decoration: none;
}
#skills a:hover {
background-color:#1E6799;
color: #ffffff;
text-decoration: underline;
}
#skills {
text-align:center;
margin: 0px auto;
padding:0;
color: navy;
list-style-type:none;
clear:both;
}
#skills td {
width: 125px;
float:left;
border:1px solid black;
border-right:none;
text-align: center;
background-color:#1A4766;
}
* html #skills td a {
width: 100%;
}
#skills td.top {
border-bottom:none;
}
#skills td.right {
border-right:1px solid #000000;
}
#skills td.nolink {
font-weight: bold;
background-color: silver;
color: #1A4766;
line-height: 30px;
border-bottom: none;
font-size: 12pt;
text-align: left;
padding-left: 5px;
}
#skills td.nolinkbottom {
font-weight: bold;
background-color: silver;
color: #1A4766;
line-height: 30px;
font-size: 12pt;
text-align: left;
padding-left: 5px;
}

/* End Small Block Menu */


/* Start Stat Tables */

.stattable {
border: 1px solid #000000;
border-bottom: none;
margin: 0;
padding: 0;
}

.stattable th {
font-weight: bold;
font-size: 11pt;
background-color: #1A4766;
border-bottom: 1px solid black;
padding: 2px;
text-align: center;
}

.stattable td {
background-color: #336699;
padding: 2px;
text-align: center;
height: 40px;
border-bottom: 1px solid black;
}

.stattable td.left {
text-align: left;
}


/* New Table Layout */
#table {
margin: auto;
border-left: 1px solid #000;
border-top: 1px solid #000;
}
#table a, #table a:visited, #table a:active {
text-decoration: underline;
color: #000;
}
#table a:hover {
text-decoration: none;
color: #000;
}
.tableheader {
font-weight: bold;
text-align: center;
background-color: #333;
color: #fff;
}
.tr1 {
padding: 3px;
background-color: #369;
color: #fff;
border-bottom: 1px solid #000;
}
.tr2 {
padding: 3px;
background-color: #ccc;
color: #000;
border-bottom: 1px solid #000;
}
td {
border-right: 1px solid #000;
border-bottom: 1px solid #000;
text-align: center;
padding: 5px;
}

th {
border-right: 1px solid #000;
border-bottom: 1px solid #000;
text-align: center;
padding: 5px;
}

This page looks exactly like I want it to in Firefox but not in ie6 or ie7. In ie6 the fieldsets are different heights but I want them to be the same (as in firefox) and in ie7 some of the submit buttons are hidden. Can someone help me with this?

Thanks...

Hello, Well ive been having this problem with my website: http://www.ngrock.com

When i visit the website using Firefox it looks just perfect but when i use IExploer, the sidebar doesn't seem to work, instead of it being on the LEFT side of the website, parallel to the content. It displays Below the content, aligned left. What can i do to get the sidebar in its place on all browsers.

Thank You.

Claudio-

I'm almost done with my new website's main template. Now, the only thing that remains is that my website looks exactly how I want it in IE and total crap in Firefox. I was wondering if anyone could help me out/figure out what's going on. The URL is www.smbmovie.com...

Hey guys, haven't built a website for a while and when I did build them I didn't really have a clue.
I've built this page which comes up great in safari but Firefox and Ie show jack.

What could be the problem?

Check: www.goldensparrowstudios.co.uk


thanks so much.

I have a small window that shows site logins by ip address.

I open it with window.open and get exactly the proper display in the proper position.

But, I'm stuck with the browser page that called window.open().

Is there a way to close that browser?

I've tried things like window.opener.close() with no luck.

Remember, I want t close the browser, not just a window.

Thanks, Mac

Hey guys,
Just got up my new site, and3 other pages than the homepage, and was wondering if there was a quick and easy way to do a browser check? The site is www.scubatoo.net. I know ther are errors in Firefox, if anyone can speculate on those I would appreciate it. As well I don't think that earlier versions that 7.0 of IE work correct either. If there is a quick way to do this please let me know.

Thanks,
Ryan

Hi,

Is there a way I can not show all the url in the browser window. for instance when showing a links page, instead of the address being

"http://www.webspace.co.uk/links.htm" could it just be "http://www.webspace.co.uk

I have seen this done but not sure how.

Thanks

Simon

Hello to everyone,

I don't know if this is the appropriate section for sucn an answer...but I didn't know where to put.

My question is this: Can anyone provide to me a way so that I will check what browser the user has and load a page according to that information?

I want to have Firefox, Opera and Internet Explorer checked.

Could someoine help me please?

Thanks.

Hey,
I've just put my website back online,
but I've got a lil' problem.
My website shows everything perfectly when using Internet Explorer,
but when openend with Firefox and others, most of the site doesn't appear as it should, pictures missing etc, is there anything I can do about this?, If so pretty please tell me!

Greets, Brenda

hi.

i would really appreciate some help here. i am totally new to designing pages but i managed to make this www.cilipi.bravehost.com .

Now, what is the problem? I display it in Mozilla and it works great, no mistakes at all but after loading it in Ie everything is messed up, i get activex codes, bcs of my flash...etc etc

i really like this site and i beg you, i really beg some guru to check my source code, i am ready to send him a whole page...everything needed to help me out. i am really desperate, having so much fine making this and uploading it...now it looks bad in ie.

please, could someone help me?

THANK YOU!

regards from croatia