Help on STRANGE styles attributes generated by WORD...

Posted on 2006-04-08
Last Modified: 2010-04-09

I have a form with a large complicated table on it that I decide to try designing in Word 2003, saving as a web page and then modifying in Dreamweaver.  I have a couple of questions.

It seems that MS uses some special style attributes that seem to work, yet I can't find an explanation of them anywhere and Dreamweaver signals as being errors (yet they work?)

For example:

mso-border-top-alt:solid #EAEAEA .5pt

I figure the mso-thing is just proprietery MS, but the -alt part, I can't find described anywhere.  Here is the whole TD in question:

<td width=739 colspan=34 valign=top style='width:7.7in;border-top:none;
  border-left:solid #EAEAEA 1.5pt;border-bottom:solid #EAEAEA 1.0pt;border-right:
  solid #EAEAEA 1.5pt;mso-border-top-alt:solid #EAEAEA .5pt;mso-border-top-alt:
  1.5pt;mso-border-color-alt:#EAEAEA;mso-border-style-alt:solid;padding:0in 0in 0in 0in'>
  <p class=MsoNormal style='margin-top:0in;margin-right:2.15pt;margin-bottom:
  0in;margin-left:2.15pt;margin-bottom:.0001pt'><span style='font-size:8.0pt;
  mso-bidi-font-family:Arial'>WHY DO I NEED TO COMPLETE THIS FORM<span
  class=GramE>?...</span></span></p>  </td>

This cell has thin gray lines on some sides and thick gray lines on other sides.  It seems to give values to the typical border attributes, then adds these "-alt" type values.  The original border values are incorrect and the -alt ones are correct.

Is this the process necessary if one wants to declare an unusually sized or colored border color?

Also, in the TABLE declaration, they go:

<table class=MsoTableGrid border=1 cellspacing=0 cellpadding=0
 solid #EAEAEA .5pt;mso-yfti-tbllook:480;mso-padding-alt:0in 0in 0in 0in;
 mso-border-insideh:.5pt solid #EAEAEA;mso-border-insidev:.5pt solid #EAEAEA'>

What is the significance of doing BORDERCOLLAPSE;COLLAPSE and then BORDER:NONE, then declaring the "-alt" values?



P.S., It works perfectly so I don't want to mess with it - I just want to understand it :)

Question by:MitchellVII
    LVL 9

    Accepted Solution

    The border-collapse:collapse mens that if all of your cells have borders, adjacent borders will merge, so as to have only one border taken into account between two cells. For example, if all your cells have a 1px border, by putting this the border will be 1px wide between two cells. If you don't put this, each cell will have its 1px border so you will have a 2px border between the cells.
    border:none in the table style attribute means that the table has no surrounding borders.
    By the way, i do not know what does the mso-border-left-alt means.. That is word specific attributes though, maybe taken into account by IE, but certainly not by other browsers.
    LVL 5

    Author Comment

    Yes i figured the "alt" was IE specific.  99% of my users have access to IE so I am not worried about it.  Apparently it does allow for better "border control" than regular border attributes - for instance, it seems to give you true colors on grays, which regular "border" doesn't seem to get at all.

    Fortunately, I am not designing this web page for the masses - just my candidates (I'm a headhunter) and I can instruct them to use IE to view the page.

    LVL 5

    Author Comment

    I just tried opening it in Netscape and it's pretty close.  I'm sure I can figure out the changes that need to be made.  Other than adjusting some sound things I should be good to go :)


    Featured Post

    6 Surprising Benefits of Threat Intelligence

    All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

    Join & Write a Comment

    A colleague recently asked me about how to give his client a small part of the web site that could be completely under the client's control.  Since I have done this sort of thing before to add emergency banners to a web site, I decided I would creat…
    Showing your events from Google Calendar in Google Maps Why? I travel all week and I thought it would be ideal if staff in office knew where I was based on my calendar. (OK real reason: my son wanted to see where I would be working, and I thoug…
    The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    754 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    20 Experts available now in Live!

    Get 1:1 Help Now