Archive for the ‘CSS’ Category

Body Background Images In Safari

Monday, November 19th, 2007

I think that it’s sort of ironic that Apple, known for making computers that “just work” and are rather forgiving with it comes to user error, would make a Web browser that is very particular and less forgiving when it comes to displaying XHTML and CSS Web sites.

As it turns out, in order to display an image in the body tag of a Web site using CSS, you must first make sure you order your rules accordingly. That order is as follows:

  1. Color (#000000, for example)
  2. URL of image
  3. Whether or not it repeats (no-repeat, repeat-x or repeat-y)
  4. It’s position along the x-axis (left, center or right)
  5. It’s position on the y-axis (top or bottom)

An example of this would look something like this:

body {
background: #000000 url(../images/bg.jpg) no-repeat center top;
}

Safari Officially Worst Modern Browser Available

Wednesday, September 12th, 2007

I just wanted to say this. Coding for Safari just requires too many work arounds for even the simplest tasks (such as displaying a background image and/or color in the body tag of the stylesheet). Safari may tout being “standards compliant,” but it most defenitely isn’t. Please, Internet surfers of the World, use Firefox instead (hell, I’d even settle for IE 7)!

More Gripes About Safari

Friday, August 24th, 2007

Safari SucksI have come to really not like Safari, perhaps even more so than Internet Explorer 7 (of course IE 6 will always have a special place in my heart of hate). Recently when attempting to implement the “Sliding Doors of CSS” from A List Apart, I noticed that universally changing the default font size (to 62.5%) is not in the capabilities of this browser. More over, you can’t highlight an element on a Web page, then right-click (or control-click, for the few Mac users out there) and view the source code of just that section. The only option available is to view the source code for the entire page. That’s lame in my opinion, but leave it to Apple to limit your options.

Another beef I have with Safari is that you can’t view a site’s CSS file directly in the browser. Attempting to do so just causes the file to be downloaded onto your hard drive and then you have to go out of the browser and open it separately in a text document (or Dreamweaver, or whatever your code editor/viewer of choice is). Again, leave it to Apple to limit your options. This is probably the biggest reason I’m not an Apple fan; they limit your choices thereby forcing you to do things their way.

Safari Beta 3 for Windows… Not Impressed

Monday, June 25th, 2007

Being the PC guy that I am, I felt compelled to give Safari a try, now that there’s a version made for Windows machines.

And I have to say, I’m a little disappointed.

Now, maybe I’m jumping too quickly to a conclusion, after all it is a Beta, but I’ve tried it out on a few of my sites and it just doesn’t even seem to be trying. On my iGoogle Theme page, it gets confused by the position of the “Back to top” anchor tag and the “position: fixed;” css tag. When you any length down the page and you want to go back up, it just inches downwards instead. It also doesn’t seem to be reading the style sheet on the University of Minnesota Drumline Web site.

Now maybe it could just be the way I’ve coded these Web sites, but I’ve also noticed some problems with other pages and their CSS. Not to mention that add-in features we’ve all come to know and love in FireFox, such as the Web Developer Toolbar, AdBlock, ScriptBlock, Theme choices, etc. aren’t even close to being an option in Safari.

So my conclusion? Well, it’s another damned browser that people are going to use whether you like it or not. I personally don’t find Safari all that great, but I’ll have to add it to my list of browsers on which to test my Web sites.

EDIT (added 07.09.07): The one cool thing about Safari Beta 3 for Windows is that you can resize any text-field box. So if the guy (or girl) who designed a site didn’t give you enough viewable space within which to write, you can take its lower-right corner and make it larger.

Internet Exploder

Wednesday, June 20th, 2007

I hate Internet Explorer.

Really, I do.

It doesn’t matter if it’s IE 7, 6, 5.whatever, etc…

I hate it.

You’d think that a company as large and as rich as Microsoft would have the ability to be compatible with more things.

Take CSS, for example. With Internet Explorer, it’s like pulling teeth to get it to work. Or actually, it’s like trying to figure out magic. Maybe that’s why Microsoft is such a powerful and rich company, they deal in magic. And not the type of magic you see everyday, I’m talking witchcraft- and voodoo-type magic.

But then again, it’s biggest competitor, Apple, isn’t much better.

Text Size: Pixels, Points, Ems and Percentages… Oh My!

Thursday, June 7th, 2007

I’ve been thinking about a lot of Web related issues lately. One of them being how different browsers handle different units of measurement for text. I’ve gone ahead and constructed a page where you can test text size and image size against different browsers.

In most browsers, there are two methods to resize text, the keyboard shortcut (press Ctrl++, Ctrl+- and Ctrl+0) and the “View > Text Size” method.

Here are my findings:

You’ll notice on a PC in Firefox (version 2.0.0.4, for reference) using either method the font size will increase and decrease no matter what method of measurement you are using to size the text (em, px, pt, %). And the images stay the same size.

On a PC in Internet Explorer 7 using the keyboard shortcut will essentially “zoom in” on the page, altering the size of both text and image. However, using the “View > Text Size” method will only resize the text that is defined by ems and percentages.

On a PC in Internet Explorer 6 using the keyboard shortcut method has no affect on any page elements. Using the “View > Text Size” method has kind of a strange effect on text size. The text defined by ems and percentages resize as you’d expect, however the text defined by pixels and points also resize, but on a much smaller scale. The images stay the same size using this method as well.

Netscape (version 8.1.2) is based off of Firefox and behaves accordingly.

Opera seems to only have a zoom feature.