SGMLXML.net A place for SGML and XML application developers.

July 26, 2007

I’ve Become a Font Snob

Filed under: Books,CSS,Rants/Musings,XML,XSL — cangione @ 1:05 am

It's two in the morning. I've been done with the content of the document I'm working on for two hours and I just finished selecting the fonts I'm going to use. This is kinda geeky even by my standards.

I blame "The NON-DESIGNER'S COLLECTION" by Robin Williams and John TOLLETT. After reading the three books I guarantee you will never look at serif and sans serif fonts the same way again. After a couple of arduous hours, I've finally selected "Franklin Gothic Medium" as my sans serif font and "Book Antiqua" as my serif font, although I would have preferred to use "RotisSemiSerif" but didn't feel like paying 200 bucks for the font.

Charles Angione

March 22, 2006

The Underscore Hack

Filed under: CSS — cangione @ 6:36 pm







We all know that IE is not the best at supporting the web standards. This leads properly coded web pages to look awful at times including this site! My typical web browser is Firefox where the pages on sgmlxml.net look great. I still have some wayward friends that use IE so I was experimenting with making the pages look better in IE.

There are a couple of different techniques talked about on the web for this problem. The one that I prefer after some experimentation is the Underscore Hack. The hack works because IE is not the brightest browser in the world. An underscore in CSS is designed to act as a comment for that attribute only, and all browsers but IE honor this.

.text {
       margin: 10px;
       _margin: 15px;
}

NOTE: You have to place the underscore rule after the real attribute since IE sees both but uses the last one it sees.


December 20, 2005

Toggle colors on html span element using Javascript

Filed under: CSS,DOM,XSLT — cangione @ 11:31 pm

Javascript for changeing the color of span elements with a particular class attribute.

<script type="text/javascript">

  function changecolor() {

      for (i=0;i<document.getElementsByTagName("span").length;
i++) {

          if
(document.getElementsByTagName("span").item(i).className == "myclass"){

             
document.getElementsByTagName("span").item(i).style.color = "green";

          }

      }

  }

  </script>

  

  .......

  

  <a
href="#" onclick="changecolor();">Change
Color</a>

  

  .......

  

  <span class="myclass">Hi There</span>

April 7, 2005

CSS maxheight and maxwidth properties

Filed under: CSS — cangione @ 1:35 am




Internet Explorer does not support the maxheight and maxwidth properties of CSS2. Firefox supports them fine.

CA

March 24, 2005

Setup XML for Arbortext Epic Editing and Direct Web Browser Display using CSS

Filed under: CSS,Software,XML — cangione @ 4:38 pm

There are times when working with XML documents that it would be nice
to be able to style the document directly. To do this with CSS here is
a recipe that works with Internet Explorer, Firefox and the Arbortext
Epic Editor.

  1. Add a css stylesheet reference in your XML document.
    <?xml-stylesheet
href="docbook.css" type="text/css"?>

  2. Modify you XML document to hide the doctype declaration in a
    comment. This stops IE from looking for it but still allows Epic to
    find it. If you are only interested in making it work with Firefox you
    can skip this step.

    <?xml version="1.0"
encoding="utf-8"?>
    
<?xml-stylesheet href="docbook.css" type="text/css"?>
    
<!-- Fragment document type declaration subset:
    
Arbortext, Inc., 1988-2004, v.4002
    
<!DOCTYPE set PUBLIC "-//Arbortext//DTD DocBook XML V4.0//EN"
    
 "axdocbook.dtd">
    
-->

  3. Set writenonasciichar=char in Epic and save the XML
    document. This writes all of the character entities that may be present
    out as characters so the web browsers don't complain about not being
    able to find the reference. This needs to either be set every time you
    edit the instance in Epic or via an ACL package.
  4. Create your CSS. A small sample docbook.css:
    book {
    
        }
    
book>title {
    
  display:block;
    
  font-size:3em;
    
  color:inherit;
    
  background:inherit;
    
  font-weight:bold;
    
}
    
          
    
legalnotice{
    
        font-weight:bold;
    
}
    
          
    
title {
    
  display:block;
    
  font-size:1.3em;
    
  color:inherit;
    
  background:inherit;
    
  font-weight:bold;
    
}
    
para {
    
        display:block;
    
        padding: 20px;
    
}

CA

Suppress the br element using CSS

Filed under: CSS — cangione @ 1:00 am

I have run into issues with the <br> element especially with
programs that convert things to HTML. A quick way to suppress all of
the breaks is to add the following to your CSS stylesheet:

br { display: none;}

CA

Powered by WordPress