[Targon]

I have some major problems with Safari and Fonts. I have a custom CSS to address some issues, altho i have a few outstanding that require attention.

1) I have a CSS with data that should force pages to load with a size 10 Techno font. Thus far, the correct font type finally displays (that being Techno), however it ignores the size an displays some ridiculous size of about 16 on EVERY page i load. What code can i enter to force Safari to abide by my request of a size 10 font?


2) Boldness-Ok some pages display some text in bold. Is there a way to over ride this so that the page is told to display bold text as either a) Normal type same size or b) Normal type 1 size bigger (11) ??

3) Link Colors-Im my CSS i have code to force all links to be underlined and be Blue in color. This works great however i have come across a site osxaudio.com where the background is also blue. Problem is i can hardly see the links as they are the same color as the background. Is there a way to tell the browser to display links in Black if the page background is blue?

4) Not sure if this relates to CSS but anyways-In IE and Omniweb when a user clicks on a link or image a nice blue line borders the objects this is the same border seen when u click in a text entry field. Safari has some crappy looking dotted grey outline, is there someway i can edit Safari to get it to display the same blue border line as is seen in IE, OW and text entry fields?

Those are my issues. here is the code in my custom Style Sheet. If its possible to apply any of the 4 issues above please provide some code for me to add to my style sheet.

Cheers inadvance

html, body, * {
font-family: Techno !important;
font-size: 10pt !important;
}
pre {
font-family: Techno !important;
}
a:link, a:link:hover {
color: blue !important;
}
a:visited, a:visited:hover, a:link:active {
color: purple !important;
}
a:link, a:visited, a:hover, a:active {
text-decoration: underline !important;
background-color: inherit !important;
}

[weirded]

Originally posted by Targon:

2) Boldness-Ok some pages display some text in bold. Is there a way to over ride this so that the page is told to display bold text as either a) Normal type same size or b) Normal type 1 size bigger (11) ??

Maybe
font-weight: normal;
in your html, body statement would work?

4) Not sure if this relates to CSS but anyways-In IE and Omniweb when a user clicks on a link or image a nice blue line borders the objects this is the same border seen when u click in a text entry field. Safari has some crappy looking dotted grey outline, is there someway i can edit Safari to get it to display the same blue border line as is seen in IE, OW and text entry fields?

Not sure if this is what you mean, but you can try this:

a:active {
border: 2px solid #00f;
}

This would make a blue 2 pixel border around the link when you click it. For some reason this don't work with images in safari so you have to specify it again specifically for img-tags:

a:active img {
border: 2px solid #00f;
}

[Targon]

Cheers man you have provided me with code that seems to fix a few things on 'MOST' pages. The image border i was talking about is working nicely. I edited the code so that pages display their own link colors but make sure that they change all visited links to purple (my color). This is working as best as can be. I tried the blue links on every page, it worked but then i noticed some pages have blue background an i couldn't see the links. The compromise is no problem to deal with.

I read the other day, that if a page specifies a Bold font an the font selected doesnt have a Bold style then Safari will ignore the font an use a default font that has bold styling. So with that in mind the workaround is to tell the page to use normal font style instead of bold.
So we added

font-weight: normal;
in the html, body statement.

This works for MOST pages but i notice a few like these two :

http://www.emusonacid.co.uk/forum/index.php

http://www.osxaudio.com/index.php

there are bold fonts that remain and my code doesn't change them to normal text and subsequently my font. Maybe this bold font on the page is not in the body but maybe in some table or cel? If this is the case would there be some more Font Normal code that needs to be entered into my Sheet that will fix this?

Lastly, ALL pages still LOAD font size at something huge like 16pt, can i get all pages to automatically display my size without me having to manually making the text smaller with key commands??

here is my current code

html, body, * {
font-family: Techno !important;
font-size: 11pt !important;
font-weight: normal;
}
pre {
font-family: Techno !important;
}
a:visited, a:visited:hover, a:link:active {
color: purple !important;
}
a:link, a:visited, a:hover, a:active {
text-decoration: underline !important;
background-color: inherit !important;
}
a:active {
border : 1px double #00CCCC;
}
a:active img {
border : 1px double #00CCCC;
}

[weirded]

Originally posted by Targon:
there are bold fonts that remain and my code doesn't change them to normal text and subsequently my font. Maybe this bold font on the page is not in the body but maybe in some table or cel?

Add this and see if it helps.

b {
font-weight: normal;
}

Lastly, ALL pages still LOAD font size at something huge like 16pt, can i get all pages to automatically display my size without me having to manually making the text smaller with key commands??

Not sure why this doesnt work. Maybe you could try with another font and see what happens? I'm on Windows right now so I can't try it here.

[Visnaut]

'pt' is a very unreliable way to specify font size in web pages. It's dependant on what a browser interprets it as, and that's all dependant on what it thinks is the default dpi (72 vs 96) etc.

For best results, always use 'px' as the font size units. That'll force a font to display to within a fixed amount of pixel space. And you usually don't have mess around with pixel heights, as sizes in points translate pretty much exactly into pixels.

Web designers usually have to employ this trick to get pages to display consistantly across all browsers/platforms.

[Targon]

Originally posted by Visnaut:
'pt' is a very unreliable way to specify font size in web pages. It's dependant on what a browser interprets it as, and that's all dependant on what it thinks is the default dpi (72 vs 96) etc.

For best results, always use 'px' as the font size units. That'll force a font to display to within a fixed amount of pixel space. And you usually don't have mess around with pixel heights, as sizes in points translate pretty much exactly into pixels.

Web designers usually have to employ this trick to get pages to display consistantly across all browsers/platforms.

Ok kool thanks for that info. Considering the metrics of the pt unit does this equate to the same physical size if the font was px? that is is a font set to 10pt the same size os a 10px font? if not what is the equivalent px size to 10pt?

[Targon]

Originally posted by weirded:
Add this and see if it helps.

b {
font-weight: normal;
}


Not sure why this doesnt work. Maybe you could try with another font and see what happens? I'm on Windows right now so I can't try it here.

Unfortunately this didn't change the pages. :-(

[Visnaut]

Originally posted by Targon:
is a font set to 10pt the same size os a 10px font? if not what is the equivalent px size to 10pt?

Yes, it should be the same size. It usually depends on the font, but most standard ones do. If it doesn't equate, then simply try raising or lowering the values.

Good luck!

[Targon]

Originally posted by Visnaut:
Yes, it should be the same size. It usually depends on the font, but most standard ones do. If it doesn't equate, then simply try raising or lowering the values.

Good luck!

Un real, u da bomb man this totally sorted out the sizing problem...now every page loads with my font size....sooooooooo fsckin happy man ;-))))))))))))))

Now if only i can get the last few bold bits of text in various pages to display as normal ill be extremely relieved

[Millennium]

Originally posted by Targon:
Ok kool thanks for that info. Considering the metrics of the pt unit does this equate to the same physical size if the font was px? that is is a font set to 10pt the same size os a 10px font? if not what is the equivalent px size to 10pt?

Actually, that depends on the machine.

On a Mac, ideally 1pt = 1px onscreen. However, this is not done consistently across browsers. Opera is the worst offender here, where 1px doesn't even equal a whole pixel. Nevertheless, 1px in a browser is generally the same as 1pt as seen in a word processor, if that is what you are going for.

On Windows, 1px = about 1.3pt. This has to do with some rather arbitrary assumptions Windows makes about screen sizes. The Mac makes them too, but at one time the Mac's, while they have never been correct for Windows.

A point is a unit of measurement commonly found in publishing; there are 72 of them in an inch. The original Macs' screen resolution was exactly 72ppi, so a pixel was in fact the same thing as a point. The original Mac printer, the ImageWriter, also had a resolution of 72dpi. This allowed for true WYSIWYG; what you saw onscreen was exactly what you would see on the page. This is what made the Mac famous, and established its dominance in the then-young area of desktop publishing.

Of course, monitors began to improve, as did printers. Most Mac monitors now have a resolution far greater than 72dpi. However, the Mac OS still assumes that all monitors have a 72dpi resolution.

Windows, for some reason, chose to assume that displays had a resolution of 96dpi. Why this is, nobody seems to know; at the time there was no monitor with that resolution, and many monitors today have now surpassed that figure. It also makes some things a lot less convenient to implement.

[york28]

The 'blue outline' thing you mentioned (dotted outline in Safari) is annoying, yes. It's the browser hilighting the link that was selected. The only way that I know of to remove it is a JavaScript like so:

Code:
<a href="link.html" onclick="this.blur()">click me</a>

There may be other ways, but this is the one that I am familiar with.

[Targon]

Originally posted by york28:
The 'blue outline' thing you mentioned (dotted outline in Safari) is annoying, yes. It's the browser hilighting the link that was selected. The only way that I know of to remove it is a JavaScript like so:

Code:
<a href="link.html" onclick="this.blur()">click me</a>

There may be other ways, but this is the one that I am familiar with.

link is dead dude

[clam2000]

link is an example

the important part is:

onclick="this.blur()"

--will

[redJag]

link blur doesn't work for me in Safari 1.0..?

[Targon]

Originally posted by weirded:
Add this and see if it helps.

b {
font-weight: normal;
}

Unfortunately this didn't change the pages. :-(

It appears the font that is different is in a table on various pages like all the links in the middle of versiontracker

http://66.179.48.100/macosx/index.shtml

Is there code to change font type/boldness in tables?

Originally posted by Targon:
Unfortunately this didn't change the pages. :-(

[Targon]

bumpty humpty