StartXchange

Welcome , You have 0 Private Messages!

03-23-08, 08:42 PM Thanks!
xxclixxx

0 Active Level
1,183 Posts
2,046 Thanks
Ever wonder how your pages look on other browsers? Well here is where you can get screenshots of it and find out!

http://browsershots.org/

Free or you can pay $15 for a month of priority processing (just gets you the screen shots faster if you are impatient like me =P)
[CENTER][FONT=Arial][SIZE=3]StartXchange Support
[url]http://support.startxchange.com[/url]
[SIZE=2]Follow Me On [URL="http://twitter.com/timlinden"]Twitter[/URL], [URL="http://www.facebook.com/lindenim"]Facebook[/URL], or [URL="http://www.timlinden.com/blog/"]My Blog[/URL][/SIZE][/SIZE][/FONT][/CENTER]
03-24-08, 12:06 AM Thanks!
drkelp

0 Active Level
562 Posts
339 Thanks
Great site thx Tim. My site looks medoiocre on all of them!!

Cheers

G
Grant Goodman aka drkelp :cool:
[b][url=http://drkelp.co.uk]Dr Kelp Best Programs that Pay[/url]
[url=http://www.angelfire.com/md/haematology/electrum.html]Dr Kelp Recommends[/url]
[url=http://trckrs.com/36948/]CTP for Champions[/url][/b]
03-24-08, 01:41 AM Thanks!


0 Active Level
0 Posts
0 Thanks
Mine look exactly as intended in all of them.
But checking for many browsers took a looong time!
Tip: Check your pages for compliance first, then most
pages will display OK in most browsers
(It can be good to know thatOpera can't center tables, but tables are soon deprecated anyway, and DIVS are often much easier to handle).
03-28-08, 10:47 AM Thanks!


0 Active Level
0 Posts
0 Thanks
Just discovered this link (thx, Tim) sounds great. I'm in queue.
I'm used to testing my stuff in IE7 only - it's my second/barely used
browser - and always get surprised with the layout difference.
I've bookmarked this link, thanks again.
03-28-08, 03:23 PM Thanks!


0 Active Level
0 Posts
0 Thanks
I have created a basic CSS file that defines some parameters that are often undefined, or defined differently in different browsers.
It helps me a lot to have my pages shown the same way for all browsers (Well, almost; some tags may be missing).
There are some "class" tags that I use a lot; they are also shown.

Here it is:
<style type="text/css">
body { font-size:20px; }
a { color:#a90; }
a:visited
{ color:#980;
text-decoration:none;
}
a:hover
{ color:#db0;
font-size:115%;
background:#33e;
}
p, dl
{ margin:0 0 1em 0;
padding:0;
}
form, img, html
{ display:block;
margin:0;
padding:0;
font-size:100%;
}
input, textarea { font-size:110%; }
h1,h2,h3,h4,h5,h6 { font-weight: bold; text-align:center; }
h1 { font-size: 300%; margin:0 0 .7em 0; }
h2 { font-size: 250%; margin:0 0 .7em 0; }
h3 { font-size: 200%; margin:0 0 .7em 0; }
h4 { font-size: 175%; margin:0 0 .7em 0; }
h5 { font-size: 150%; margin:0 0 .7em 0; }
h6 { font-size: 120%; margin:0 0 .7em 0; }

.banner { width:20em; }
.c, .l, .r { font-size:80%; }
.c
{ font-weight:normal;
background:#fafaff;
text-align:right;
}
.l
{ color:red;
text-align:left;
}
.r, .right { text-align:right; }
</style>

Before you can use this you must send me $5. :D:D:D
03-31-08, 06:28 AM Thanks!


0 Active Level
0 Posts
0 Thanks
Is there a special tag or action to implement in source code in order to have
the same lay out/looking in most of the browsers used?
I'm talking about basic HTLM, I'm not an advanced webpages creator, just
learning day after day how to improve my skills. I did the test with Browsershots, oups!...
03-31-08, 07:19 AM Thanks!


0 Active Level
0 Posts
0 Thanks
My basic CSS takes care of most of it, since it overrides browser defaults.
Things that some browser's won't do, like centering tables, can't be solved with CSS.
03-31-08, 07:57 AM Thanks!


0 Active Level
0 Posts
0 Thanks
Thanks, inge, but frankly learning CSS right now is not my plan :o
10-22-08, 02:04 PM Thanks!


0 Active Level
0 Posts
0 Thanks
thanks tim and inge
10-22-08, 03:56 PM Thanks!
abrockie

0 Active Level
1,691 Posts
1,207 Thanks
Before you can use this you must send me $5. :D:D:D

Would you take Euros?
Team Leader, Team Clean Living
10-22-08, 05:57 PM Thanks!


0 Active Level
0 Posts
0 Thanks
Is there a special tag or action to implement in source code in order to have the same lay out/looking in most of the browsers used?
I'm talking about basic HTLM, I'm not an advanced webpages creator, just
learning day after day how to improve my skills. I did the test with Browsershots, oups!...


In order to make it look right you should remove everything (or as much as possible) that has to do with layout from your HTML.
HTML should describe the contents, and CSS the layout. If you do this right, everything should in principle look the same with all modern browsers.
Some browser bugs can be overcome by using some simple tricks in the CSS, because some browsers ignore and some interpret some special constructs.

What I wrote before about some browsers not being able to center objects is wrong. The problem was that the tag "align" is actually invalid in XHTML code, and replaced by the CSS code "margin:auto". Using this, centering also looks the same in IE7 and FF7 (and probably Opera).

In order to make sure that different browsers display the same thing, you should used HTML1.0 Strict, which means that you will not be able to make a proper website without putting ALL the formatting into CSS files, and very close to none in the HTML (Tags like <p></p>, <br /> etc. are still accepted). Additionally there are simple things you simply can't do without using a little JavaScript -- which means that clients that switch off JavaScript will make otherwise compliant websites more or less useless.

Constructs like <center> or <div align="center"> are ignored in a standard-compliant browser when XHTML is used. This made me believe that IE7 was OK and FF3 was not. The fact is the other way around, because these constructs are not even defined in XHTML.

I recommend warmly the book "CSS, The missing Manual" by David Sawyer McFarland. This book opened my eyes in many ways, and has made it much easier for me to control the output from my web scripts.

I also recommend for anyone writing web scripts to check them using the W3C validator. The error descriptions can be hard to understand in the beginning, but it's a GREAT help to make sure that your websites are compliant and WILL look the same with different browsers.
10-22-08, 05:59 PM Thanks!


0 Active Level
0 Posts
0 Thanks
Would you take Euros?

Anything except Icelandic Kronor! :D
01-30-09, 03:36 PM Thanks!


0 Active Level
0 Posts
0 Thanks
Hey, that's nice!

I do wish they had a deselect all and select all for each section. I had to do a lot of clicking.

Thanks Tim!
02-01-09, 02:07 PM Thanks!
dehawkinz

0 Active Level
2,373 Posts
979 Thanks
Actually I discovered that css has a major problem - not every browser supports it, in which case your site looks, well, weird!!

maybe there is a way of detecting if a browser supports css (not using javascript as there is no guarantee this will be supported) and if not, redirecting to an alternate page?

DeHawkinz
DeHawkinz
Team DeHawkinz Team Leader


02-06-09, 02:57 AM Thanks!
jwgrafflin

0 Active Level
140 Posts
1 Thanks
To center a table with CSS, simply define a class in your stylesheet like this:

.center { text-align: center; margin: auto; }

Then put your table within a <div> like so:

<div class="center">
<table>......</table>
</div>

And, if you have room on your hard drive, install Firefox, Opera and Safari (there is a Safari for Windows now). That way you can check how your pages look immediately.

Also, the trick to getting your pages looking pretty much the same on all four browsers is to use containers, like so:

<div id="container">
<div class="content">
</div>
</div>

Following Inge's statement regarding IE and Firefox, it's a best practice to write your pages for Firefox. They will then, most likely, look just great in all the other major browsers. The case is not so true if you write them for IE.

To get a good working knowledge of html and xhtml, as well as css, I suggest W3Schools tutorials at http://www.w3schools.com/default.asp or Tizag tutorials at http://www.tizag.com/

And to validate your pages for compliance with web standards, go to the W3C Validation site at http://validator.w3.org/

For CSS validation, go to http://jigsaw.w3.org/css-validator/

Just keep this in mind when validating: Just because your page validates okay doesn't mean it will display in all browsers okay. Nothing beats checking your site in all the major browsers.
05-26-09, 03:03 PM Thanks!


0 Active Level
0 Posts
0 Thanks
[COLOR=orange]http://fa2a5nn9td758sbzlcwa2i2x0a.hop.clickbank.net/?tid=AZ1969[/COLOR]The System Explains How To Grow A Twitter Account Rapidly W/total Automation Via 5 Videos. In Video 6, We Then Show How Create A Viral Affiliate Business. The System Is Automated For Affiliates Using Your Twitter Account. Turn It On, Forget, & Make Money!:)
05-26-09, 03:08 PM Thanks!


0 Active Level
0 Posts
0 Thanks
Apparently you DID NOT pay attention to the postings in the New User Forum Thread...Otherwise you would not have broken the cardinal rule of
ABSOLUTELY NO OUTSIDE ADVERTISING ALLOWED ANYWHERE IN THE FORUM OR THROUGH THE PRIVATE MESSAGING SYSTEM!

Any Outside Advertising URLs found here will be removed without fail and the member dealt with accordingly!

Further, this is NOT the appropriate thread for posting this message!

READ and HEED those postings in the New User Forum Thread...
It is there to keep ALL members from getting into trouble with Admin!
07-22-09, 01:20 PM Thanks!


0 Active Level
0 Posts
0 Thanks
...centering tables, can't be solved with CSS.

I beg to differ.

Using one hack for IE, add to the css style body tag text-align:center;

Then to your table or div tag, add margin:0px auto; and text-align:left;
The text-align:left; counters the centering body tag for content within your table or div

example:

table {margin:0px auto;text-align:left;}
or, better yet
div {margin:0px auto;text-align:left;}

Hope it helps!

[NOTE: I am assuming you want all your tables or divs centered. If not, you can specify a Class or ID as JWGRAFFLIN mentioned above for more specific control. There's a lot more to know about CSS and it can't all be taught here, but if you have a more specific question please feel free to ask.]
07-22-09, 01:23 PM Thanks!


0 Active Level
0 Posts
0 Thanks
Apparently you DID NOT pay attention to the postings in the New User Forum Thread...Otherwise you would not have broken the cardinal rule of
ABSOLUTELY NO OUTSIDE ADVERTISING ALLOWED ANYWHERE IN THE FORUM OR THROUGH THE PRIVATE MESSAGING SYSTEM!

Any Outside Advertising URLs found here will be removed without fail and the member dealt with accordingly!

Further, this is NOT the appropriate thread for posting this message!

READ and HEED those postings in the New User Forum Thread...
It is there to keep ALL members from getting into trouble with Admin!


msbeejay-
Who are you referring to?
The links listed in that post are tutorials and web standards compliance, not advertising.
Are you referring to Signatures? Just trying to clear up what you are referencing.
Thanks,
Mark
07-22-09, 01:43 PM Thanks!


0 Active Level
0 Posts
0 Thanks
An interesting site. I know what my sites look like though, so I don't need to use this, but it's nice of you to share it. I know others get some use out of it.