Spacing in tables

I'm having trouble getting the spacing in my table the way I
want it. The
main problem is the first row has more background showing
along the top than
I'd like. The page is at
http://www.torrtech.com/Pages/test.htm
I'd like
less, or maybe no, background visible above the 'TORR' logo.
I have
cellpadding at 8 in the SECOND row on the right.. the row
with the photos..
in order to give space between the photos. Maybe that's the
cause? I tried
changing it to zero and didn't see a change along the top.
Everything looks
the way I'd like in Design View.. logo at the very top left.
Can someone
tell me what I'm missing? Hopefully resolving this part will
carryover to
fixing the bigger-than-I'd-like space between the photos and
the text above
them. The space below the photos is what I'd like it to be
above the photos
as well.
Thanks in advance
Boze

Thanks! That did it. I don't know that it looks any better
but knowing the
fix is the main thing.
Thanks again
Boze
"djinn" <[email protected]> wrote in
message
news:eu64o3$m34$[email protected]..
Boze wrote:
> I'm having trouble getting the spacing in my table the
way I want it. The
> main problem is the first row has more background
showing along the top
> than
> I'd like. The page is at
http://www.torrtech.com/Pages/test.htm
I'd
> like
> less, or maybe no, background visible above the 'TORR'
logo. I have
Hi,
Try removing the <p>/paragraph tag that surrounds the
image - make sure
that it surrounds only the text below.
HTH
chin chin
Sinclair

Similar Messages

  • Spacing in table of contents

    Is there a way to adjust, to increase, the minimum amount of spacing between a table of contents entry and it's page number for single line paragraphs? I know that I can insert non-breaking spaces in long paragraphs, but if a paragraph fits on one line, that doesn't help.
    The screen grab below shows an entry on the first line that is too close to the page number. The second line is the way I want it to look, but I have to do a forced return to set it up. Of couse, when I re-generate the table of contents the forced return disappears, so I'm hoping that there is another technique.
    If editing the frame.ini file would control the spacing, how woiuld that be implemented?
    Is there a script to control the spacing?
    I'm cross-posting this in the FrameMaker unstructured forum as well.

    Jay,
    The method I use is not obvious but works because of the way FrameMaker seems to work.
    For EACH paragraph format used in your TOC, the ones ending in TOC, open the paragraph designer. One of the tabs (cannot remember which one) has a place to specify spacing adjustments. There are three boxes: minimum, optimum, and maximum. Typically, the minimum is set to 75%, the optimum to 100%, and the maximum to 125%. Add 100, or 200, or 300% to the minimum AND the maximum, BUT NOT the optimum, which remains at 100%. For example, the minimum could be 175%, the optimum 100%, and the maximum 225%. Click Update All. I would do this in the template file, and then import the paragraph formats into all the files in your book. Then update the book.
    I THINK FrameMaker tries to adjust the spacing using the minimum and maximum, determines where to break the line, and then sets the spacing to the optimum 100%. The result is a line break a short space before the end of the line. You can experiment. The more you add to minimum and maximum, the longer the space between the line break and the end of the line.
    Van

  • How do I keep the paragraph spacing in tables?

    Hi,
    I used a table and styles to format a CV in InDesign. Unfortunately the paragraph spacings are only applied in cells, but not inbetween them.
    In the following table, for example, there would be a paragraph spacing between p1 and p2 but not between p2 and p3, and p3 and p4.
    Header 1
    Header 2
    p1
    p2
    p3
    p4
    So far, I matched the cell indents with the paragraph spacings, but creating a cell style for each paragraph style seems weired to me.
    Is there a better way to do this?
    Regards

    qzmufu wrote:
    Thank you. I don't use border lines and a column layout came to my mind. The reason why I didn't opt for it was that I did not know how to place the text like in the example below in columns - well at least not conveniently.
    Header 1
    Header 2
    00/0000 - 00/0000
    Experience 1
    blablabla
    00/0000 - 00/0000
    Experience 2
    blablabla
    00/0000 - 00/0000
    Experience 3
    blablabla
    Unfortunately, the fancy split and span functions aren't availabe for me, as I'm still using CS4.
    Anyway, knowing that there is probably no better way already helps me. So again, thank you.
    You're welcome.
    If this is the format you want, you can create a paragraph stye that uses an indention setting that positions the wrap-around "blablabla" content where you want it, and sets the first-line indent to a negative amount equal to the positive indent. For example, if the blahblah should start at 4" from the left, the first-line indent should be set to -4". Also include a left-aligned tab stop position of 4" so that when you type a tab character after the date, the Experience starts at the same 4" indent. This is called a "hanging paragraph."
    Search Google for terms like "InDesign hanging paragraph tutorial" without quotes for more about this technique.
    For the different vertical position of the left column's text vs. the right column's text, you can create a character style that sets the baseline shift in Advanced Character Formats to a minus value that gives you the look you want. If your right-column paragraphs run longer than 2 lines, you'll need to modify the baseline shift to suit the centering against the right column. You can create paragraph styles named 2-line shift, 3-line shift, etc for this effect. You can apply the character style to the selected left-column text manually, or you can incorporate the character styles into the paragraph styles by using the Nested Styles feature in the Drop Caps and Nested Styles pane of the Paragraph Styles panel. You'll need a paragraph style for each different number of experience wrap-around lines; for example paragraph styles named 2-line experience, 3-line experience, etc. In each of these styles, create the nested style for the appropriate number of experience lines.
    Search Google for terms like "InDesign nested styles tutorial" without quotes for more about this technique.
    There's a lot you can do with tailoring your text. Usually styles are helpful for repeating any things you'd need to do manually, but often folks avoid styles because they take some time to set up. When you choose New Paragraph Style, the settings of the paragraph that contains the cursor are used, so you can easily save any manual work you've done to tailor a paragraph into the style you create. Consider the effort of creating styles as an investment that pays you back many times over, each time you use the styles.
    HTH
    Regards,
    Peter
    Peter Gold
    KnowHow ProServices

  • Incrase Line Spacing in Table

    Hi All,
    is it possible to increase the line spacing for a ui-element table (CL_WD_TABLE) in ABAP Web Dynpro? If so,can you explain how to do this?
    BR
    Dominik

    Hi,
    as I read the explanation in following article set_width does not solve the problem in my eyes.
    http://help.sap.com/saphelp_sm40/helpdata/en/6e/ae0e422dfcdc2ce10000000a1550b0/content.htm
    any has a different view?
    BR
    Dominik

  • Problems with spacing in table(cs2, PC)

    Hi everyone
    I have imported a excell file into indesign cs2 (using place).
    When I mark the whole table I cannot change the height of the rows.
    I can choose at least or exactly however I cannot change the size, that box I gray. What am I doing wrong?

    A link to the your live test page would be much more productive here. 
    It's much easier for us to diagnose problems when we can see your page & images in our browsers.
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb

  • Double spacing a table -- How?

    If "\t" takes care of my colum spacing is it possible to double space my rows? (Why do I have the fully feeling that it isn't going to be as simple as "\t" !! ) :)

    Why do I have the fully feeling that it isn't going to be as simple as "\t"but damn close. "\t" is short for "tab", "\n" is short for "new line", so throw in as many "\n"'s as you need.
    Lee

  • How do I remove a gap between table rows in InDesign?

    I need help in figuring out how to remove gaps between table rows.  I have tried Table Spacing under Table Set-up, but it doesn't work.
    Here's what I'm working on:
    As you can see there are gaps above the first row and below last row under the header Business Management Technology.  I cannot select that gap.  How do I remove it, so that the first class, 31058, is flush with the black header?  (and the last class, 32675, is flush with the Chemistry header?)
    Any advice would be greatly appreciated.
    Thanks,
    Sarah 

    SRiegel wrote:
    ...it may be that the black bar is created with a paragraph rule instead of cell color.
    I hadn't considered that, and your example is proof-of-concept. However, now that you made me look closer, I still don't think that's the OP's case, seeing as the text in the OP's header rows appears to span more than one column, belying what I suppose must be merged cells.* The column strokes in the "gap" appear to disqualify it (the gap) as part of a row with merged cells.
    *There is still another possibility that someone "made pictures" of tables with merged cells by overlaying text frames to make the header rows. I've run across all kinds of such "carpentry;" especially when the file may have originated at the desk of someone who avoids or resists use of tables. They find ways to fake them and/or their features.
    [still looking]

  • Product Thumbnails Overlapping

    Hello I got a problem with the spacing of the product thumbnail in the "individual small",,, when I add 1-2 products it looks good but more than 2 look terrible, all the thumbnails are squeezed together to the left side overlapping each other, I want the product thumbnails to be centered and with a small space in between them in rows of 4 how do I do that? thank you    
    here's a link HERR UR

    Hey Aboo,
    So in your CSS file "ModuleStyleSheets.css" locate and replace (should be line 538):
    table.productTable {
    border-collapse: collapse;
    border-spacing: 1;
    table-layout: fixed;  <---- REMOVE THIS LINE
    width: 100%;
    with:
    table.productTable {
    border-collapse: collapse;
    border-spacing: 1;
    width: 100%;
    Hope this helps!
    -Ryan

  • CSS height property use in Fluid grid layout

    Hi, I'm totally new to fluid grid layout and just got started in it. I have a div tag that has 5px height and I sucessfully applied that and seem fine only on Tablet landscape (1024x768) and Small tablet landscape (800x600), nevertheless it isn't even displaying on Mobile portrait (320x480), Mobile landscape (480x320), Small tablet portrait (600x800) and Tablet portrait (768x1024).
    My coding is below
    index.html
    <!doctype html>
    <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
    <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
    <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
    <!--[if gt IE 8]><!-->
    <html class="">
    <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled Document</title>
    <link href="fluid.grid.layout/boilerplate.css" rel="stylesheet" type="text/css">
    <link href="fluid.grid.layout/style.css" rel="stylesheet" type="text/css">
    <!--
    To learn more about the conditional comments around the html tags at the top of the file:
    paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
    Do the following if you're using your customized build of modernizr (http://www.modernizr.com/):
    * insert the link to your js here
    * remove the link below to the html5shiv
    * add the "no-js" class to the html tags at the top
    * you can also remove the link to respond.min.js if you included the MQ Polyfill in your modernizr build
    -->
    <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script src="fluid.grid.layout/respond.min.js"></script>
    </head>
    <body>
    <div class="gridContainer clearfix">
      <div id="LayoutDiv1"></div>
    </div>
    </body>
    </html>
    boilerplate.css
    @charset "utf-8";
    * HTML5 ✰ Boilerplate
    * What follows is the result of much research on cross-browser styling.
    * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
    * Kroc Camen, and the H5BP dev community and team.
    * Detailed information about this CSS: h5bp.com/css
    * Dreamweaver modifications:
    * 1. Commented out selection highlight
    * 2. Removed media queries section (we add our own in a separate file)
    * ==|== normalize ==========================================================
    /* =============================================================================
       HTML5 display definitions
       ========================================================================== */
    article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
    audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
    audio:not([controls]) { display: none; }
    [hidden] { display: none; }
    /* =============================================================================
       Base
       ========================================================================== */
    * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
    * 2. Force vertical scrollbar in non-IE
    * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
    html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
    body { margin: 0; font-size: 13px; line-height: 1.231; }
    body, button, input, select, textarea { font-family: sans-serif; color: #222; }
    * Remove text-shadow in selection highlight: h5bp.com/i
    * These selection declarations have to be separate
    * Also: hot pink! (or customize the background color to match your design)
    /* Dreamweaver: uncomment these if you do want to customize the selection highlight
    *::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
    *::selection { background: #fe57a1; color: #fff; text-shadow: none; }
    /* =============================================================================
       Links
       ========================================================================== */
    a { color: #00e; }
    a:visited { color: #551a8b; }
    a:hover { color: #06e; }
    a:focus { outline: thin dotted; }
    /* Improve readability when focused and hovered in all browsers: h5bp.com/h */
    a:hover, a:active { outline: 0; }
    /* =============================================================================
       Typography
       ========================================================================== */
    abbr[title] { border-bottom: 1px dotted; }
    b, strong { font-weight: bold; }
    blockquote { margin: 1em 40px; }
    dfn { font-style: italic; }
    hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
    ins { background: #ff9; color: #000; text-decoration: none; }
    mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
    /* Redeclare monospace font family: h5bp.com/j */
    pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
    /* Improve readability of pre-formatted text in all browsers */
    pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
    q { quotes: none; }
    q:before, q:after { content: ""; content: none; }
    small { font-size: 85%; }
    /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
    sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
    sup { top: -0.5em; }
    sub { bottom: -0.25em; }
    /* =============================================================================
       Lists
       ========================================================================== */
    ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
    dd { margin: 0 0 0 40px; }
    nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
    /* =============================================================================
       Embedded content
       ========================================================================== */
    * 1. Improve image quality when scaled in IE7: h5bp.com/d
    * 2. Remove the gap between images and borders on image containers: h5bp.com/e
    img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
    * Correct overflow not hidden in IE9
    svg:not(:root) { overflow: hidden; }
    /* =============================================================================
       Figures
       ========================================================================== */
    figure { margin: 0; }
    /* =============================================================================
       Forms
       ========================================================================== */
    form { margin: 0; }
    fieldset { border: 0; margin: 0; padding: 0; }
    /* Indicate that 'label' will shift focus to the associated form element */
    label { cursor: pointer; }
    * 1. Correct color not inheriting in IE6/7/8/9
    * 2. Correct alignment displayed oddly in IE6/7
    legend { border: 0; *margin-left: -7px; padding: 0; }
    * 1. Correct font-size not inheriting in all browsers
    * 2. Remove margins in FF3/4 S5 Chrome
    * 3. Define consistent vertical alignment display in all browsers
    button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
    * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
    * 2. Correct inner spacing displayed oddly in IE6/7
    button, input { line-height: normal; *overflow: visible; }
    * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
    table button, table input { *overflow: auto; }
    * 1. Display hand cursor for clickable form elements
    * 2. Allow styling of clickable form elements in iOS
    button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
    * Consistent box sizing and appearance
    input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
    input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
    input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
    * Remove inner padding and border in FF3/4: h5bp.com/l
    button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
    * 1. Remove default vertical scrollbar in IE6/7/8/9
    * 2. Allow only vertical resizing
    textarea { overflow: auto; vertical-align: top; resize: vertical; }
    /* Colors for form validity */
    input:valid, textarea:valid {  }
    input:invalid, textarea:invalid { background-color: #f0dddd; }
    /* =============================================================================
       Tables
       ========================================================================== */
    table { border-collapse: collapse; border-spacing: 0; }
    td { vertical-align: top; }
    /* ==|== primary styles =====================================================
       Author:
       ========================================================================== */
    /* ==|== non-semantic helper classes ========================================
       Please define your styles before this section.
       ========================================================================== */
    /* For image replacement */
    .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
    .ir br { display: none; }
    /* Hide from both screenreaders and browsers: h5bp.com/u */
    .hidden { display: none !important; visibility: hidden; }
    /* Hide only visually, but have it available for screenreaders: h5bp.com/v */
    .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
    /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
    .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
    /* Hide visually and from screenreaders, but maintain layout */
    .invisible { visibility: hidden; }
    /* Contain floats: h5bp.com/q */
    .clearfix:before, .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { zoom: 1; }
    /* ==|== print styles =======================================================
       Print styles.
       Inlined to avoid required HTTP connection: h5bp.com/r
       ========================================================================== */
    @media print {
      * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
      a, a:visited { text-decoration: underline; }
      a[href]:after { content: " (" attr(href) ")"; }
      abbr[title]:after { content: " (" attr(title) ")"; }
      .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
      pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
      thead { display: table-header-group; } /* h5bp.com/t */
      tr, img { page-break-inside: avoid; }
      img { max-width: 100% !important; }
      @page { margin: 0.5cm; }
      p, h2, h3 { orphans: 3; widows: 3; }
      h2, h3 { page-break-after: avoid; }
    style.css
    @charset "utf-8";
    /* Simple fluid media
       Note: Fluid media requires that you remove the media's height and width attributes from the HTML
       http://www.alistapart.com/articles/fluid-images/
    img, object, embed, video {
              max-width: 100%;
    /* IE 6 does not support max-width so default to width 100% */
    .ie6 img {
              width:100%;
              Dreamweaver Fluid Grid Properties
              dw-num-cols-mobile:                    4;
              dw-num-cols-tablet:                    8;
              dw-num-cols-desktop:          10;
              dw-gutter-percentage:          25;
              Inspiration from "Responsive Web Design" by Ethan Marcotte
              http://www.alistapart.com/articles/responsive-web-design
              and Golden Grid System by Joni Korpi
              http://goldengridsystem.com/
    /* Mobile Layout: 480px and below. */
    .gridContainer {
              margin-left: auto;
              margin-right: auto;
              width: 85.5%;
              padding-left: 2.25%;
              padding-right: 2.25%;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              height:5px;
              display: block;
    /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
    @media only screen and (min-width: 481px) {
    .gridContainer {
              width: 97.5%;
              padding-left: 1.25%;
              padding-right: 1.25%;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              height:5px;
              display: block;
    /* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
    @media only screen and (min-width: 769px) {
    .gridContainer {
              width: 98%;
              max-width: 1232px;
              padding-left: 1%;
              padding-right: 1%;
              margin: auto;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
              height:5px;
              background-color:#FBB829;
    respond.min.js
    /*! Respond.js v1.0.1pre: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs  */
    (function(e,h){e.respond={};respond.update=function(){};respond.mediaQueriesSupported=h;if(h){return}var u=e.document,r=u.documentElement,i=[],k=[],p=[],o={},g=30,f=u.getElementsByTagName("head")[0]||r,b=f.getElementsByTagName("link"),d=[],a=function(){var B=b,w=B.length,z=0,y,x,A,v;for(;z<w;z++){y=B[z],x=y.href,A=y.media,v=y.rel&&y.rel.toLowerCase()==="stylesheet";if(!!x&&v&&!o[x]){if(y.styleSheet&&y.styleSheet.rawCssText){m(y.styleSheet.rawCssText,x,A);o[x]=true}else{if(!/^([a-zA-Z]+?:(\/\/)?)/.test(x)||x.replace(RegExp.$1,"").split("/")[0]===e.location.host){d.push({href:x,media:A})}}}}t()},t=function(){if(d.length){var v=d.shift();n(v.href,function(w){m(w,v.href,v.media);o[v.href]=true;t()})}},m=function(G,v,x){var E=G.match(/@media[^\{]+\{([^\{\}]+\{[^\}\{]+\})+/gi),H=E&&E.length||0,v=v.substring(0,v.lastIndexOf("/")),w=function(I){return I.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+v+"$2$3")},y=!H&&x,B=0,A,C,D,z,F;if(v.length){v+="/"}if(y){H=1}for(;B<H;B++){A=0;if(y){C=x;k.push(w(G))}else{C=E[B].match(/@media ([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1;k.push(RegExp.$2&&w(RegExp.$2))}z=C.split(",");F=z.length;for(;A<F;A++){D=z[A];i.push({media:D.match(/(only\s+)?([a-zA-Z]+)(\sand)?/)&&RegExp.$2,rules:k.length-1,minw:D.match(/\(min\-width:[\s]*([\s]*[0-9]+)px[\s]*\)/)&&parseFloat(RegExp.$1),maxw:D.match(/\(max\-width:[\s]*([\s]*[0-9]+)px[\s]*\)/)&&parseFloat(RegExp.$1)})}}j()},l,q,j=function(E){var v="clientWidth",x=r[v],D=u.compatMode==="CSS1Compat"&&x||u.body[v]||x,z={},C=u.createDocumentFragment(),B=b[b.length-1],w=(new Date()).getTime();if(E&&l&&w-l<g){clearTimeout(q);q=setTimeout(j,g);return}else{l=w}for(var y in i){var F=i[y];if(!F.minw&&!F.maxw||(!F.minw||F.minw&&D>=F.minw)&&(!F.maxw||F.maxw&&D<=F.maxw)){if(!z[F.media]){z[F.media]=[]}z[F.media].push(k[F.rules])}}for(var y in p){if(p[y]&&p[y].parentNode===f){f.removeChild(p[y])}}for(var y in z){var G=u.createElement("style"),A=z[y].join("\n");G.type="text/css";G.media=y;if(G.styleSheet){G.styleSheet.cssText=A}else{G.appendChild(u.createTextNode(A))}C.appendChild(G);p.push(G)}f.insertBefore(C,B.nextSibling)},n=function(v,x){var w=c();if(!w){return}w.open("GET",v,true);w.onreadystatechange=function(){if(w.readyState!=4||w.status!=200&&w.status!=304){return}x(w.responseText)};if(w.readyState==4){return}w.send(null)},c=(function(){var v=false;try{v=new XMLHttpRequest()}catch(w){v=new ActiveXObject("Microsoft.XMLHTTP")}return function(){return v}})();a();respond.update=a;function s(){j(true)}if(e.addEventListener){e.addEventListener("resize",s,false)}else{if(e.attachEvent){e.attachEvent("onresize",s)}}})(this,(function(f){if(f.matchMedia){return true}var e,i=document,c=i.documentElement,g=c.firstElementChild||c.firstChild,h=!i.body,d=i.body||i.createElement("body"),b=i.createElement("div"),a="only all";b.id="mq-test-1";b.style.cssText="position:absolute;top:-99em";d.appendChild(b);b.innerHTML='_<style media="'+a+'"> #mq-test-1 { width: 9px; }</style>';if(h){c.insertBefore(d,g)}b.removeChild(b.firstChild);e=b.offsetWidth==9;if(h){c.removeChild(d)}else{d.removeChild(b)}return e})(this));
    I really do appreciate your efforts to help me solve this problem... Thank you in advance

    Height is determined by content.  I can't think of a single reason to have a div height of 5px because almost nothing will fit inside that small a space without problems. 
    As to why it doesn't show up in other devices, you must have put that style into the Tablet CSS code instead of the default Mobile CSS code.
    Fluid Grids build up from Mobile (applied to everything) with specific rules for Tablets, then Desktops.
    Best advice, use Fluid Grids for layout only.  Use a separate CSS file for content styles.
    Hope this helps,
    Nancy O.

  • Help!! I have a gap problem!

    I'm working on a freelance project and it's giving me a
    headache. I've got the test page up so that you guys can take a
    look at it:
    http://www.csnmarketingsolutions.com/testing
    See those little navigational buttons along the top? Well,
    you shouldn't be able to see the background in between the buttons
    and the main body of the thing. In other words it should not have
    that dark line beneath them. Please help! I've tried putting
    border="0" in the TD tag and the table tag and the TR tags, but no
    luck. I can't figure out what's causing this "gap problem". Oh, and
    it's not just under the navigational tabs that I'm having this
    problem. This is happening wherever I put an image. So, if somebody
    out there could just take a look at my code or give me any kind of
    input as to what the problem could be, you'd be a total life saver!
    Thanks in advance! I hope you can figure out what I can't!
    It's driving me nuts!

    There are 3 elements that control spacing: padding, border,
    and margin. I'd try setting them all to 0, as a first step -
    img {
    padding:0;
    border:0;
    margin:0;
    Then, if that doesn't work, check your tables. I hate tables
    for layout, and am far too lazy to import your code into
    dreamweaver, but there are HTML attributes that control spacing in
    tables seperate from the CSS. Those are - cellspacing and
    cellspacing. Try setting those explicitly to zero in Dreamweaver.
    Hope this helps! :)

  • Make a logo over lap menu bar and slideshow

    Hi!
    I want to have the logo of my page overlapping the menu bar and the slideshow.
    Below is a picture og how the site layout looks now and the code.
    Can anyone please help me out.
    Thanks in advice,
    Simon
    Code
    HTML:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
    <!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
    <!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
    <!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--> <html xmlns="http://www.w3.org/1999/xhtml"> <!--<![endif]-->
    <head>
              <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
              <title>#</title>
              <meta name="description" content=" add description  ... " />
              <meta name="keywords"    content=" add keywords     ... " />
              <!-- //////// Favicon ////////  -->
              <link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
              <!-- //////// Css - stylesheets ////////  -->
              <link href="_layout/style.css"       rel="stylesheet" type="text/css" media="all" />
              <link href="_layout/style-print.css" rel="stylesheet" type="text/css" media="print" />
              <!-- //////// jQuery ////////  -->
              <script src="_layout/js/jquery-1.5.2.min.js" type="text/javascript"></script>
              <!-- //////// DD_belatedPNG - png fix for IE6 ////////  -->
              <!--[if IE 6 ]>
                        <script src="_layout/js/pngfix/DD_belatedPNG_0.0.8a-min.js" type="text/javascript"></script>
              <![endif]-->
              <!-- //////// Cufon - font Replacement ////////  -->
              <script src="_layout/js/cufon/cufon.js" type="text/javascript"></script>
              <!-- //////// Tipsy - tooltips ////////  -->
              <script src="_layout/js/tipsy/jquery.tipsy.js" type="text/javascript"></script>
              <link href="_layout/js/tipsy/css.tipsy.css" rel="stylesheet" type="text/css" />
              <!-- //////// prettyPhoto - lightbox ////////  -->
              <script src="_layout/js/prettyphoto/jquery.prettyPhoto.js" type="text/javascript"></script>
              <link href="_layout/js/prettyphoto/css.prettyPhoto.css" rel="stylesheet" type="text/css" />
              <!-- //////// Validity - form validation ////////  -->
              <script src="_layout/js/validity/jquery.validity.js" type="text/javascript"></script>
              <link href="_layout/js/validity/css.validity.css" rel="stylesheet" type="text/css" />
              <!-- //////// Cycle - content slider  ////////  -->
              <script src="_layout/js/cycle/jquery.cycle.all.min.js" type="text/javascript"></script>
              <!-- //////// Tabify - create tabs ////////  -->
              <script src="_layout/js/tabify/jquery.tabify-1.4.js" type="text/javascript"></script>
              <!-- //////// Accordion - create accordions ////////  -->
              <script src="_layout/js/accordion/jquery.accordion.js" type="text/javascript"></script>
              <!-- //////// Custom Js ////////  -->
              <script src="_layout/js/scripts.js" type="text/javascript"></script>
              <script src="_layout/js/plugins.js" type="text/javascript"></script>
              <style type="text/css">
    <!--
    a:link {
              text-decoration: none;
    a:visited {
              text-decoration: none;
    a:hover {
              text-decoration: none;
              color: #2eabeb;
    a:active {
              text-decoration: none;
    -->
    </style><noscript>
                                  <link href="_layout/style-nojs.css" rel="stylesheet" type="text/css" />
                                  <div class="nojs-warning"><strong>JavaScript seems to be Disabled!</strong> Some of the website features are unavailable unless JavaScript is enabled.</div>
              </noscript>
              <div id="wrap">
                        <div id="header">
                        <div class="img"><a href="#"><img src="_layout/images/Logo.png"  /></a> </div>
    <ul id="menu"> 
      <li><a href="#" class="drop"></a>
        <!-- Begin 4 columns Item -->
        <div class="dropdown_4columns">
          <!-- Begin 4 columns container -->
          <div class="col_4">
          </div>
          <div class="col_1">
            <h3>Some Links</h3>
            <ul>
              <li><a href="#">ThemeForest</a></li>
              <li><a href="#">GraphicRiver</a></li>
              <li><a href="#">ActiveDen</a></li>
              <li><a href="#">VideoHive</a></li>
              <li><a href="#">3DOcean</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Useful Links</h3>
            <ul>
              <li><a href="#">NetTuts</a></li>
              <li><a href="#">VectorTuts</a></li>
              <li><a href="#">PsdTuts</a></li>
              <li><a href="#">PhotoTuts</a></li>
              <li><a href="#">ActiveTuts</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Other Stuff</h3>
            <ul>
              <li><a href="#">FreelanceSwitch</a></li>
              <li><a href="#">Creattica</a></li>
              <li><a href="#">WorkAwesome</a></li>
              <li><a href="#">Mac Apps</a></li>
              <li><a href="#">Web Apps</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Misc</h3>
            <ul>
              <li><a href="#">Design</a></li>
              <li><a href="#">Logo</a></li>
              <li><a href="#">Flash</a></li>
              <li><a href="#">Illustration</a></li>
              <li><a href="#">More...</a></li>
            </ul>
          </div>
        </div>
        <!-- End 4 columns container -->
      </li>
      <!-- End Home Item -->
      <li><a href="#" class="drop">Projects</a>
        <!-- Begin 4 columns Item -->
        <div class="dropdown_4columns">
          <!-- Begin 4 columns container -->
          <div class="col_4">
          </div>
          <div class="col_1">
            <h3>Some Links</h3>
            <ul>
              <li><a href="#">ThemeForest</a></li>
              <li><a href="#">GraphicRiver</a></li>
              <li><a href="#">ActiveDen</a></li>
              <li><a href="#">VideoHive</a></li>
              <li><a href="#">3DOcean</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Useful Links</h3>
            <ul>
              <li><a href="#">NetTuts</a></li>
              <li><a href="#">VectorTuts</a></li>
              <li><a href="#">PsdTuts</a></li>
              <li><a href="#">PhotoTuts</a></li>
              <li><a href="#">ActiveTuts</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Other Stuff</h3>
            <ul>
              <li><a href="#">FreelanceSwitch</a></li>
              <li><a href="#">Creattica</a></li>
              <li><a href="#">WorkAwesome</a></li>
              <li><a href="#">Mac Apps</a></li>
              <li><a href="#">Web Apps</a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3>Misc</h3>
            <ul>
              <li><a href="#">Design</a></li>
              <li><a href="#">Logo</a></li>
              <li><a href="#">Flash</a></li>
              <li><a href="#">Illustration</a></li>
              <li><a href="#">More...</a></li>
            </ul>
          </div>
        </div>
        <!-- End 4 columns container -->
      </li>
      <!-- End 5 columns Item -->
        <li><a href="#" class="drop"></a><!-- Begin 4 columns Item -->
            <div class="dropdown_4columns"><!-- Begin 4 columns container -->
                <div class="col_4">
                </div>
                <div class="col_1">
                 <h3></h3>
                    <ul>
                        <li><a href="#"> </a></li>
                    </ul>  
                </div>
                <div class="col_1">
                    <h3></h3>
                    <ul>
                        <li><a href="#">NetTuts</a></li>
                    </ul>  
                </div>
                <div class="col_1">
                    <h3></h3>
                    <ul>
                    </ul>  
                </div>
                <div class="col_1">
                </div>
            </div><!-- End 4 columns container -->
        </li><!-- End 4 columns Item -->
        <li><a href="#" class="drop"></a>
          <!-- Begin 4 columns Item -->
          <div class="dropdown_4columns">
            <!-- Begin 4 columns container -->
            <div class="col_4">
            </div>
            <div class="col_1">
              <h3></h3>
              <ul>
                <li><a href="#">Area </a></li>
                <li><a href="#"> </a></li>
                <li><a href="#">l</a></li>
                <li><a href="#"></a></li>
              </ul>
            </div>
            <div class="col_1">
              <h3></h3>
              <ul>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#"></a></li>
                <li><a href="#">Pt</a></li>
                <li><a href="#">s</a></li>
                <li><a href="#">t</a></li>
                <li><a href="#"></a></li>
                <li><a href="#">Sn</a></li>
                <li><a href="#">s</a></li>
              </ul>
            </div>
               <div class="col_1">
              <h3></h3>
              <br />
              <ul>
                <li><a href="#">t</a></li>
                <li><a href="#">Pn</a></li>
                <li><a href="#">Sn</a></li>
                <li><a href="#">s</a></li>
              </ul>
            </div>
            <div class="col_1">
              <h3></h3>
              <ul>
                <li><a href="#"></a></li>
                <li><a href="#"> </a></li>
                <li><a href="#"> </a></li>
                <li><a href="#">Pt</a></li>
                <li><a href="#">I</a></li>
                <li><a href="#">st</a></li>
              </ul>
            </div>
            <div class="col_1">
              <h3></h3>
              <ul>
                <li><a href="#"></a></li>
              </ul>
            </div>
              <div class="col_1">
              <h3></h3>
              <ul>
                <li><a href="#"></a></li>
              </ul>
            </div>
          </div>
          <!-- End 4 columns container -->
        </li>
        <li><a href="#" class="drop">Sales Support</a>
                <!-- Begin 4 columns Item -->
                <div class="dropdown_4columns">
                  <!-- Begin 4 columns container -->
                  <div class="col_4">
            </div>
                  <div class="col_1">
                    <h3></h3>
                    <ul>
                      <li><a href="#"></a></li>
              </ul>
            </div>
                  <div class="col_1">
                    <h3></h3>
                    <ul>
                      <li><a href="#"></a></li>
                      <li><a href="#"></a></li>
                      <li><a href="#">i</a></li>
              </ul>
            </div>
            <br />
                  <div class="col_1">
                    <h3></h3>
                    <ul>
                      <li><a href="#"></a></li>
                      <li><a href="#"></a></li>
                      <li><a href="#"></a></li>
              </ul>
            </div>
                  <div class="col_1">
                    <h3></h3>
                    <ul>
              </ul>
            </div>
          </div>
      </li>
        <li><a href="#" class="drop"></a>
        <!-- Begin 4 columns Item -->
        <div class="dropdown_4columns">
          <!-- Begin 4 columns container -->
          <div class="col_4">
          </div>
          <div class="col_1">
            <h3></h3>
            <ul>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3></h3>
            <ul>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3></h3>
            <ul>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3></h3>
            <ul>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
              <li><a href="#"></a></li>
            </ul>
          </div>
          <div class="col_1">
            <h3></h3>
            <ul>
              <li><a href="#"></a></li>
            </ul>
          </div>
        </div>
        <li class="menu_right"><a href="#" class="drop">Main</a> 
            <div class="dropdown_1column align_right"> 
                    <div class="col_1"> 
                        <ul class="simple"> 
                            <li><a href="#"><strong></strong></a></li> 
                            <li><a href="#"></a></li> 
                            <li><a href="#"></a></li> 
                            <li><a href="#"></a></li> 
                        </ul>    
                    </div> 
            </div> 
      </li>
    </ul>
    <div class="row slideshow-container no-print fixed">
      <div id="slideshow-index">
                                                      <ul>
                                                                <li>
                                                                  <div class="slidetext">
                                                          <h2>Proin porttitor<br /> pulvinar risus nec</h2>
                                                                                    <p>Sed interdum eleifend mollis. Proin quis lectus libero. Integer eu lectus erat, id aliquet risus.
                                                                                     Vivamus vitae mollis purus. Fusce id diam at purus sodales mollis.  <a href="#">more</a></p>
                                                                  </div>
                                                          <img src="images/slider/1.jpg" width="948" height="400" alt="" />                                                            </li>
                                                                <!-- end slide 1 -->
                                                                <li>
                                                                          <img src="images/slider/2.jpg" width="948" height="400" alt="" />
                                                                          <div class="slidetext">
                                                                                    <h2>Curabitur<br /> sed sollicitudin orci.</h2>
                                                                                    <p>Nunc eu tellus sed felis vestibulum pulvinar sed ac enim. Quisque tincidunt urna id arcu egestas
                                                                                     a rhoncus purus molestie erat eget nunc varius. <a href="#">more</a></p>
                                                                          </div>
                                                                </li><!-- end slide 2 -->
                                                                <li>
                                                                          <img src="images/slider/3.jpg" width="948" height="400" alt="" />
                                                                          <div class="slidetext">
                                                                                    <h2>Suspendisse vest<br /> pretium laoreet</h2>
                                                                                    <p>Aliquam erat volutpat. Maecenas tincidunt porta hendrerit. Sed quis tristique nulla. Fusce volutpat
                                                                                     lobortis tellus sed tincidunt consequat egestas a elementum dolor. <a href="#">more</a></p>
                                                                          </div>
                                                        </li><!-- end slide 3 -->
                            <li>
                                                                          <img src="images/slider/4.jpg" width="948" height="400" alt="" />
                                                                          <div class="slidetext">
                                                                          </div>
                                                                </li><!-- end slide 4 -->
                                                      </ul>
                                                      <div id="index-slideshow-pager"> </div>
      </div><!-- end #slideshow -->
                <!-- ////////////////HERTIL ER ALT RETT ///////////////////////////////////////////////////////////////////////////////////////// ////////////////// -->
                                  <div id="content">
                <table width="948px" height="40px" margin="margin: auto 6px auto 6px">
                <tr>
                <td><a href="#"></a></td>
                <td><a href="#"></a></td>
                <td><a href="#"></a></td>
                </tr>
                </table>
                <br />
                                  <div class="venstre" style="width: 530px; margin: auto 6px auto 40px;">
                                   <h2>Heading</h2>
                                                      <p>
                                                                Text </p>
                </div>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                  </br>
                                </br>
                                  </br>
                                  </br>
                                  </br>
                        </div><!-- end #content -->
                        <!-- ///////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////// -->
    </div><!-- end #header -->
              </div><!-- end #wrap -->
                                  <!-- KOPIER HERFRA ORGINALE FININI/////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////// -->
              <div style="background: url(images/footer.png) no-repeat; position: bottom; margin: auto 6px 40px 6px; color: #ffffff;">
                                  <div id="fot" style="width: 940px; float:center; text-align: left; margin-left: 40px; margin-right: 40px; padding-top: 25px; color: #ffffff;">
                                            <table style="border: 0px;">
                                                      <tr style="border: 0px;">
                                                                <td width="146px" style="border: 0px;">
    *table*
                                            </table>
                                  </div>
    </div>
              <script type="text/javascript"> Cufon.now(); </script>
              <!-- analytics code here -->
                        <!-- /TIL HIT////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////// -->
    </body>
    </html>
    CSS:
    /* =RESET
    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym, address,
    big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,d t,dd,ol,ul,li,fieldset,
    form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:;border:0;outl ine:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-a lign:baseline}body{line-height:1;color:black;background:white}ol,ul{list-style:none}table{ border-collapse:separate;border-spacing:0}/* tables still need 'cellspacing="0"' in the markup */caption,th,td{text-align:left;font-weight:normal}blockquote:before,blockquote:after,q:b efore,q:after{content:""}blockquote,q{quotes:""""}
    /* =GENERAL
    div.img
      margin-left:6px;
      z-index:200;
              body, ul, li {
              font-size:12px;
              font-family:Arial, Helvetica, sans-serif;
              line-height:21px;
              text-align:left;
    #menu {
              list-style:none;
              width:870px;
              margin:0px auto 0px 44px;
              height:40px;
              padding:0px 20px 0px 20px;
              z-index:100;
              /* Background color and gradients */
              background: #636363;
              background: -moz-linear-gradient(top, #636363, #353535);
              background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#636363), to(#353535));
    #menu li {
              float:left;
              display:block;
              text-align:center;
              position:relative;
              padding: 4px 10px 4px 10px;
              margin-right:5px;
              margin-top:5px;
              border:none;
              z-index:100;
    #menu li:hover {
              border: 1px solid #777777;

    Thanks Nancy,
    However, two new issues appeared when I added the float, both the text in the menu and the image slider is now too far left.
    See image below.

  • How can I create 25 charts on a page, each chart 2 columns and 10 rows

    I need to create a chart that has 25 tables. 5 tables in 5 columns. Each table has 2 columns and 10 rows. I know it can fit all on 1 page as I have seen it done but I can not figure out how

    I had some initial difficulty understanding your question. In Numbers, a "chart" is a graph.
    You want to create a 5 x 5 array of tables, each with two columns and 10 rows, placed on a single page.
    At the default size, each cell on a new Table is 1 inch wide and 0.2 inches high. So without displaying a title, each of your 25 charts would occupy a two inch square space.
    Butted closely together, that's a space that is 10 inches wide by 10 inches high.
    On a machine set to US localization,the default page size is US Letter, placed in Landscape orientation. Left, right and top margins are set to 0.75", bottom margin is 0.5", and there is a 0.25" height reserved for page header and page footer.
    That leaves a working space that's 9.5" wide and 6.75" high.
    Obviously, some adjustments will be needed.
    0.2" is pretty much the minimum for row height. You can go smaller by typing in a smaller height in the Table Inspector, but even with 9 point type, you begin to lose the descenders on ps and qs. Go with 0.2, then use the slider in Print view to further shrink the content.
    If you can narrow the columns significantly (to 0.75" or less), then go to Page setup and change to Portrait orientation.
    In the Sheet Inspector, decrease all margins to 0.5", and the header and footer spaces to 0. Set page orientation to Portrait.
    Now consider the Table(s). If you've opened a new, blank document, you'll have a multi column, multi row table with one header row and one header column. If you don't need the header row and header column, delete them (column A, Row 1) right away.
    Reduce the number of rows to 10 and the number of columns to 2. Select the whole table and, in the Table inspector, set the row height to 0.16" and the row width to 0.73".
    With the table still selected. press command-D four times to create four duplicate tables.
    Go View > Show Rulers, then View > Show Print View. go back to the Table Inspector and use the slider to set Content Scale to about 94%.
    Drag the still selected Table to the right margin of the page. Press command-A to Select All.
    Go Arrange > Align > Top
    Go Arrange > Distribute Space > Horizontal.
    With all five tables still selected, press command-D to duplicate the set.
    Hold down the Shift key and press the left arrow once, then the down arrow 14 times. This should bring the new row of tables into line with the previous ones, and move them down the page to just below the first row of tables. If fine adjustment is needed, use the arrow keys with the shift key released.
    Repeat three more times to add another three rows of tables.
    Adjust the spacing between tables as necessary.
    Regards,
    Barry

  • Adding template break box model and font

    I have been working on this one for a few hours now and I can't figure it out. I am working with the HTML5 Boilerplate and recreating the home page for our company. When I do not include the template, the file works fine in IE. But the second I apply a template the whole page becomes broken and the IE box model applies and my font sizing gets messed up.
    I have included a link to the files on a testing server, if this is not allowed, let me know and I can put up the code.
    Excuse the cupcakes from FlexSlider, I have not yet finished that piece.
    Working (no template): http://www.qa.mpay.com/index.asp
    Not working (template): http://www.qa.mpay.com/copy.asp
    Do I just need to rework my entire code so that it is more compliant with the IE Box Model qualifications, ie. div inside of a div with width on one and padding/margin on the other?

    Alright here's the code for the one that's not working. After posting last night, I realized the links were probably only viewable internally.
    UPDATE: Just added <html> after <!doctype html> like I've seen you post about in another forum discussion. That seems to have fixed it. Why is that needed? Isn't it the html tag being opened in the line <html class="no-js" lang="en"> What I mean by this, is why does it work fine in other browsers when that is missing, but it messes up with IE?
    P.S. I'm starting to blame H5BP for poor documentation, but I'm learning a lot in the process.
    TEMPLATE: (without <html>)
    templates>template_page_home_new.dwt
    <!doctype html>
    <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
    <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
    <!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
    <!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
    <!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
    <head>
      <meta charset="utf-8">
      <!-- Use the .htaccess and remove these lines to avoid edge case issues.
           More info: h5bp.com/b/378 -->
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>MPAY Inc.</title>
    <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="tags" -->
    <meta name='description' content='Payroll Software/Services- Business Process Outsourcing, Reseller and Referral Programs for Payroll Providers, Brokers, CPAs, and more offered by MPAY Inc'/>
    <meta name='keywords' content='MPAY, payroll, payentry.com, millennium, millennium payroll, payroll processing, payroll software, online payroll, outsourcing, business process outsourcing,  timekeeping, Boston, MA, Charlotte, NC, work comp, workers comp, SecureView, online tax forms'/>
    <!-- TemplateEndEditable -->
      <!-- Mobile viewport optimized: j.mp/bplateviewport -->
      <meta name="viewport" content="width=device-width,initial-scale=1">
      <!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
      <!-- CSS: implied media=all -->
      <!-- CSS concatenated and minified via ant build script-->
      <link rel="stylesheet" href="../css/style.css">
      <link rel="stylesheet" href="../css/flexslider.css" type="text/css" media="screen" />
      <!-- end CSS-->
        <!-- FlexSlider pieces -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
      <!-- All JavaScript at the bottom, except for Modernizr / Respond.
           Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
           For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
      <script src="../js/libs/modernizr-2.0.6.min.js"></script>
    </head>
    <body>
    <div id="container">
        <!-- Header Start -->
      <div id="navigation">
        <div id="logoregion">
              <div id="logo">
                  <a href="default.asp"><img src="../images/logo.gif" alt="mpay_logo" /></a>
              </div>
              <div id="headerlink">
                  <ul>
                          <li><a href="../client-login.asp"><p class="new">NEW!</p>  <img src="../images/blue_bullet_line.gif" alt=""> Client Login  </a></li>
                          <li><a href="contact_us.asp"><img src="../images/blue_bullet_line.gif" alt=""> Contact Us  </a></li>
                          <li><a href="careers.asp"><img src="../images/blue_bullet_line.gif" alt=""> Careers  </a></li>
                          <li><a href="about_us.asp"><img src="../images/blue_bullet_line.gif" alt=""> About Us</a></li></ul>
              </div>
              <div id="contact">
              (781) 810-9000<br />
              <a href="mailto:[email protected]">[email protected]</a>
              </div>
          </div>
          <div id="mainnav">
              <ul class="navigation-controls">
                      <li><a href="../index.html"><p class="navigation-text">Home</p></a></li>
                      <li><a href="../services.html"><p class="navigation-text">Services</p></a></li>
                      <li><a href="../products.html"><p class="navigation-text">Products</p></a></li>
                      <li><a href="../solutions.html"><p class="navigation-text">Solutions</p></a></li>
                      <li><a href="../support.html"><p class="navigation-text">Client Support</p></a></li>
                      <li class="nav-border-right"><a href="../resources.html"><p class="navigation-text">Resources</p></a></li>
               </ul>
          </div>
        </div> 
        <!-- Header End -->
      <!-- TemplateBeginEditable name="EditRegionContent" --><!-- TemplateEndEditable -->
        <!-- Footer Start -->
            <div id="footer">
              <div id="footercontent">
                  <div id="legal">
                  <a href="../index.html">MPAY Inc.</a>  |  
                  <a href="../legal.html">Legal Notices</a>  |  
                  <a href="../privacy.html">Your Privacy</a>
                  </div>
                  <div id="copyright">
                   <script type="text/javascript">
          now=new Date();
          year=now.getFullYear();
              </script>
                   &copy; Copyright
                   <script type="text/javascript">
          document.write (year);
                   </script>
                   MPAY, Inc. All Rights Reserved.</div>
             </div>
           </div>
      <!-- Footer End -->
       </div>
    <!-- JavaScript at the bottom for fast page loading -->
      <!-- TemplateBeginEditable name="JavaCode" --><!-- TemplateEndEditable -->
      <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="../js/libs/jquery-1.6.2.min.js"><\/script>')</script>
      <!-- scripts concatenated and minified via ant build script-->
      <script defer src="../js/plugins.js"></script>
      <script defer src="../js/script.js"></script>
      <!-- end scripts-->
        <!-- Act-On Analytics Code -->
         <script type="text/javascript">
           /* <![CDATA[ */
           document.write (
              '<img src="http://marketing.mpay.com/acton/bn/1170/visitor.gif?ts='+
              new Date().getTime()+
              '&ref='+escape(document.referrer) + '">'
           /* ]]> */
           </script>
      <!-- Google Analytics Code -->
      <script>
        window._gaq = [['_setAccount','UA-12607129-1'],['_trackPageview'],['_trackPageLoadTime']];
        Modernizr.load({
          load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
      </script>
    </body>
    </html>
    File it's being applied to:
    copy.asp
    <!-- InstanceBegin template="/Templates/template_page_home_new.dwt" codeOutsideHTMLIsLocked="false" --><!doctype html>
    <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
    <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
    <!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
    <!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
    <!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
    <head>
      <meta charset="utf-8">
      <!-- Use the .htaccess and remove these lines to avoid edge case issues.
           More info: h5bp.com/b/378 -->
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>MPAY Inc.</title>
    <!-- InstanceEndEditable -->
    <!-- InstanceBeginEditable name="tags" -->
    <meta name='description' content='Payroll Software/Services- Business Process Outsourcing, Reseller and Referral Programs for Payroll Providers, Brokers, CPAs, and more offered by MPAY Inc'/>
    <meta name='keywords' content='MPAY, payroll, payentry.com, millennium, millennium payroll, payroll processing, payroll software, online payroll, outsourcing, business process outsourcing,  timekeeping, Boston, MA, Charlotte, NC, work comp, workers comp, SecureView, online tax forms'/>
    <style type="text/css">
    <!--
    .style1 {color: #00274c}
    -->
    </style>
    <!-- InstanceEndEditable -->
      <!-- Mobile viewport optimized: j.mp/bplateviewport -->
      <meta name="viewport" content="width=device-width,initial-scale=1">
      <!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
      <!-- CSS: implied media=all -->
      <!-- CSS concatenated and minified via ant build script-->
      <link rel="stylesheet" href="css/style.css">
      <link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
      <!-- end CSS-->
        <!-- FlexSlider pieces -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
      <!-- All JavaScript at the bottom, except for Modernizr / Respond.
           Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
           For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
      <script src="js/libs/modernizr-2.0.6.min.js"></script>
    </head>
    <body>
    <div id="container">
        <!-- Header Start -->
      <div id="navigation">
        <div id="logoregion">
              <div id="logo">
                  <a href="default.asp"><img src="images/logo.gif" alt="mpay_logo" /></a>
              </div>
              <div id="headerlink">
                  <ul>
                          <li><a href="client-login.asp"><p class="new">NEW!</p>  <img src="images/blue_bullet_line.gif" alt=""> Client Login  </a></li>
                          <li><a href="contact_us.asp"><img src="images/blue_bullet_line.gif" alt=""> Contact Us  </a></li>
                          <li><a href="careers.asp"><img src="images/blue_bullet_line.gif" alt=""> Careers  </a></li>
                          <li><a href="about_us.asp"><img src="images/blue_bullet_line.gif" alt=""> About Us</a></li></ul>
              </div>
              <div id="contact">
              (781) 810-9000<br />
              <a href="mailto:[email protected]">[email protected]</a>
              </div>
          </div>
          <div id="mainnav">
              <ul class="navigation-controls">
                      <li><a href="index.html"><p class="navigation-text">Home</p></a></li>
                      <li><a href="services.html"><p class="navigation-text">Services</p></a></li>
                      <li><a href="products.html"><p class="navigation-text">Products</p></a></li>
                      <li><a href="solutions.html"><p class="navigation-text">Solutions</p></a></li>
                      <li><a href="support.html"><p class="navigation-text">Client Support</p></a></li>
                      <li class="nav-border-right"><a href="resources.html"><p class="navigation-text">Resources</p></a></li>
               </ul>
          </div>
        </div> 
        <!-- Header End -->
      <!-- InstanceBeginEditable name="EditRegionContent" --><!--! start of #container -->
        <div id="slideshow">
            <!--=============================
            Markup for FADE animation
            =================================-->
            <div class="flexslider">
            <ul class="slides">
                <li>
                    <a href="#"><img src="img/planet_hollywood.jpg" />
                    <div class="flex-caption">
                        <div id="slideone">
                            <h2 class="gold" >MPAY Sales &amp; Product <br />Roadmap Workshop</h2><br />
                            <h3 class="white">
                            March 2, 2012 / Las Vegas
                            <br />
                            </h3>
                             <br /> <br /> <br />
                            <p class="gold underline">
                            Learn more about IPPA Event
                            </p>
                        </div>
                    </div></a>
                </li>
                <li>
                    <a href="#"><img src="img/inacup_samoa.jpg" />
                    <div class="flex-caption">
                        <h2 >Our Products</h2><br />
                        <h3 >Payentry.com
                        <br />Secure and reliable online solution for payroll and human resource management
                        Millennium
                        <br />User-friendly PC solution provides a flexible system with robust functionality
                        </h3>
                    </div></a>
                </li>
                <li>
                    <a href="#"><img src="img/inacup_donut.jpg" />
                    <div class="flex-caption">
                        <h2 >Our Solutions</h2><br />
                        <h3 >Business Process Outsourcing<br />
                    Reseller Program<br />
                    Referral Program<br />
                    Direct Services
                        </h3>
                    </div></a>
                </li>
                <li>
                    <a href="#"><img src="img/inacup_pumpkin.jpg" />
                    <div class="flex-caption">
                        <h2 >Compliance &amp; Security</h2><br />
                        <h3 >Payroll Processing and Tax Management<br />
                    Employee Management<br />
                    New Hire Reporting<br />
                    Workers’ Compensation<br />
                    Wage Garnishment<br />
                    COBRA Administration
                        </h3>
                    </div></a>
                </li>
                <li>
                    <a href="#"><img src="img/inacup_donut.jpg" />
                    <div class="flex-caption">
                        <h2 >Paperless Solutions</h2><br />
                        <h3 >Secure Document Delivery via SecureView<br />
                    Employee Self Service with Online Tax Forms<br />
                    Money Network Payroll Distribution Service
                        </h3>
                    </div></a>
                </li>
            </ul>
            <div >
            <ul class="custom-controls">
                    <li><a href="#">Upcoming Events</a></li>
                    <li><a href="#">Our Products</a></li>
                    <li><a href="#">Our Solutions</a></li>
                    <li><a href="#">Compliance & Security</a></li>
                    <li><a href="#">Paperless Solutions</a></li>
             </ul>
             </div>           
          </div>
        </div>
        <div id="main" role="main">
            <div id="banner">
              <div id="leftbanner" class="bluedropshadow">Learn how MPAY can find a <br />solution that’s right for you.</div>
              <div id="bannerdivision">
              <img src="img/banner_division.png" alt="" />
              </div>
              <div id="rightbanner">
                <div id="emailbutton">
                <a href="#"><img src="img/email_us_button.png" alt="Email Us!" /></a></div>
                <div id="or" class="bluedropshadow">or</div>
                <div id="callus">
                Call us today at<br />
                781-810-9000</div>
              </div>
            </div>
          <div id="bannerbottom">
              </div>
            <div id="leftcol">
              <div id="introduction">
              <p>MPAY Inc. is a <a href="#">payroll software</a> and <a href="#">services</a> company providing strategic <a href="#">business solutions</a> to employers and business partners nationwide. MPAY presents a variety of programs, including <a href="#">business process outsourcing</a>, to a wide range of <a href="#">industries</a>. MPAY’s offerings streamline processes, improve productivity, and simplify administration, allowing clients to get the most out of their workday.</p>
              </div>
              <div id="twitterfeed">
                  <div id="twitterlogo">
                  <h4>Twitter<br />Feed</h4>
                  </div>
                  <div id="twitter">  
                  </div>
                <p class="viewall"><a href="#">View All</a></p>
              </div>
            </div>
            <div id="rightcol">
              <div id="mediacenter">
                <div>
                <h4>Media Center</h4>
                </div>
                <div id="medialinks">
                <p class="medialinks"><a href="#"><img class="mediaicons" src="img/news_icon.png" alt="News Icon" />News</a></p>
                <p class="medialinks"><a href="#"><img class="mediaicons" src="img/press_icon.png" alt="Press Release Icon" />Press Releases</a></p>
                <p class="medialinks"><a href="#"><img class="mediaicons" src="img/calendar_icon.png" alt="Calendar Icon" />Calendar</a></p>
                <p class="medialinks"><a href="#"><img class="mediaicons" src="img/client_icon.png" alt="Client Testimonials Icon" />Client Testimonials</a></p>
                </div>
              </div>
              <div id="affandawards">
                <div id="affandawardstitle">
                <h4>Affiliates &amp; Awards</h4>
                </div>
                <div id="affandawardsframe">
                  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="200" height="150" title="sponsors_small">
                    <param name="movie" value="sponsors_small.swf">
                    <param name="quality" value="high">
                    <embed src="sponsors_small.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="150"></embed>
                  </object>
                </div>
              </div>
              <div id="socialmedia">
                <div id="reachout">
                Reach <br />Out To Us!
                </div>
                <div id="socialarrow">
                <img src="img/social_arrow.gif">
                </div>
                <div id="socialicons">
                <a href="#"><img class="socialmediaicons" src="img/facebook_30px.gif" alt="Facebook Icon" /></a>
                <a href="#"><img class="socialmediaicons" src="img/twitter_30px.gif" alt="Twitter Icon" /></a>
                <a href="#"><img class="socialmediaicons" src="img/linkedin_30px.gif" alt="LinkedIn Icon" /></a>
                </div>
              </div>
            </div>
        </div>
    <!--! end of #container -->
    <!-- InstanceEndEditable -->
        <!-- Footer Start -->
            <div id="footer">
              <div id="footercontent">
                  <div id="legal">
                  <a href="index.html">MPAY Inc.</a>  |  
                  <a href="legal.html">Legal Notices</a>  |  
                  <a href="privacy.html">Your Privacy</a>
                  </div>
                  <div id="copyright">
                   <script type="text/javascript">
          now=new Date();
          year=now.getFullYear();
              </script>
                   &copy; Copyright
                   <script type="text/javascript">
          document.write (year);
                   </script>
                   MPAY, Inc. All Rights Reserved.</div>
             </div>
           </div>
      <!-- Footer End -->
       </div>
    <!-- JavaScript at the bottom for fast page loading -->
      <!-- InstanceBeginEditable name="JavaCode" -->
            <!-- Hook up the FlexSlider -->
        <script type="text/javascript">
            $(window).load(function() {
                $('.flexslider').flexslider({
                    manualControls: '.custom-controls li a'
        </script>
        <!-- Twitter Feed -->
    <script type="text/javascript">
    $(document).ready(function(){
        $.getJSON('http://twitter.com/status/user_timeline/MPAYInc.json?count=3&callback=?', function(data){
            $.each(data, function(index, item){
                $('#twitter').append('<div class="tweet"><p>' + item.text.linkify() + '</p><p class="timestamp">' + relative_time(item.created_at) + '</p></div>');
        function relative_time(time_value) {
          var values = time_value.split(" ");
          time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
          var parsed_date = Date.parse(time_value);
          var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
          var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
          delta = delta + (relative_to.getTimezoneOffset() * 60);
          var r = '';
          if (delta < 60) {
            r = 'a minute ago';
          } else if(delta < 120) {
            r = 'couple of minutes ago';
          } else if(delta < (45*60)) {
            r = (parseInt(delta / 60)).toString() + ' minutes ago';
          } else if(delta < (90*60)) {
            r = 'an hour ago';
          } else if(delta < (24*60*60)) {
            r = '' + (parseInt(delta / 3600)).toString() + ' hours ago';
          } else if(delta < (48*60*60)) {
            r = '1 day ago';
          } else {
            r = (parseInt(delta / 86400)).toString() + ' days ago';
          return r;
        String.prototype.linkify = function() {
            return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
                return m.link(m);
    </script><!-- InstanceEndEditable -->
      <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="../js/libs/jquery-1.6.2.min.js"><\/script>')</script>
      <!-- scripts concatenated and minified via ant build script-->
      <script defer src="js/plugins.js"></script>
      <script defer src="js/script.js"></script>
      <!-- end scripts-->
        <!-- Act-On Analytics Code -->
         <script type="text/javascript">
           /* <![CDATA[ */
           document.write (
              '<img src="http://marketing.mpay.com/acton/bn/1170/visitor.gif?ts='+
              new Date().getTime()+
              '&ref='+escape(document.referrer) + '">'
           /* ]]> */
           </script>
      <!-- Google Analytics Code -->
      <script>
        window._gaq = [['_setAccount','UA-12607129-1'],['_trackPageview'],['_trackPageLoadTime']];
        Modernizr.load({
          load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
      </script>
    </body>
    <!-- InstanceEnd --></html>
    CSS
    css>style.css
    * HTML5 ✰ Boilerplate
    * What follows is the result of much research on cross-browser styling.
    * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
    * Kroc Camen, and the H5BP dev community and team.
    * Detailed information about this CSS: h5bp.com/css
    * ==|== normalize ==========================================================
    /* =============================================================================
       HTML5 display definitions
       ========================================================================== */
    article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
    audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
    audio:not([controls]) { display: none; }
    [hidden] { display: none; }
    /* =============================================================================
       Base
       ========================================================================== */
    * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
    * 2. Force vertical scrollbar in non-IE
    * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
    html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
    body { margin: 0; font-size: 100%; line-height: 150%; }
    body, button, input, select, textarea { font-family: sans-serif; color: #222; }
    * Remove text-shadow in selection highlight: h5bp.com/i
    * These selection declarations have to be separate
    * Also: hot pink! (or customize the background color to match your design)
    ::-moz-selection { background: #496793; color: #fff; text-shadow: none; }
    ::selection { background: #496793; color: #fff; text-shadow: none; }
    /* =============================================================================
       Links
       ========================================================================== */
    a { color: #00e; }
    a:visited { color: #551a8b; }
    a:hover { color: #06e; }
    a:focus { outline: thin dotted; }
    /* Improve readability when focused and hovered in all browsers: h5bp.com/h */
    a:hover, a:active { outline: 0; }
    /* =============================================================================
       Typography
       ========================================================================== */
    abbr[title] { border-bottom: 1px dotted; }
    b, strong { font-weight: bold; }
    blockquote { margin: 1em 40px; }
    dfn { font-style: italic; }
    hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
    ins { background: #ff9; color: #000; text-decoration: none; }
    mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
    /* Redeclare monospace font family: h5bp.com/j */
    pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
    /* Improve readability of pre-formatted text in all browsers */
    pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
    q { quotes: none; }
    q:before, q:after { content: ""; content: none; }
    small { font-size: 85%; }
    /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
    sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
    sup { top: -0.5em; }
    sub { bottom: -0.25em; }
    /* =============================================================================
       Lists
       ========================================================================== */
    ul, ol { margin: 0em 0; padding: 0 0 0 0px; }
    dd { margin: 0 0 0 40px; }
    nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
    /* =============================================================================
       Embedded content
       ========================================================================== */
    * 1. Improve image quality when scaled in IE7: h5bp.com/d
    * 2. Remove the gap between images and borders on image containers: h5bp.com/e
    img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
    * Correct overflow not hidden in IE9
    svg:not(:root) { overflow: hidden; }
    /* =============================================================================
       Figures
       ========================================================================== */
    figure { margin: 0; }
    /* =============================================================================
       Forms
       ========================================================================== */
    form { margin: 0; }
    fieldset { border: 0; margin: 0; padding: 0; }
    /* Indicate that 'label' will shift focus to the associated form element */
    label { cursor: pointer; }
    * 1. Correct color not inheriting in IE6/7/8/9
    * 2. Correct alignment displayed oddly in IE6/7
    legend { border: 0; *margin-left: -7px; padding: 0; }
    * 1. Correct font-size not inheriting in all browsers
    * 2. Remove margins in FF3/4 S5 Chrome
    * 3. Define consistent vertical alignment display in all browsers
    button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
    * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
    * 2. Correct inner spacing displayed oddly in IE6/7
    button, input { line-height: normal; *overflow: visible; }
    * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
    table button, table input { *overflow: auto; }
    * 1. Display hand cursor for clickable form elements
    * 2. Allow styling of clickable form elements in iOS
    button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
    * Consistent box sizing and appearance
    input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
    input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
    input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
    * Remove inner padding and border in FF3/4: h5bp.com/l
    button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
    * 1. Remove default vertical scrollbar in IE6/7/8/9
    * 2. Allow only vertical resizing
    textarea { overflow: auto; vertical-align: top; resize: vertical; }
    /* Colors for form validity */
    input:valid, textarea:valid {  }
    input:invalid, textarea:invalid { background-color: #f0dddd; }
    /* =============================================================================
       Tables
       ========================================================================== */
    table { border-collapse: collapse; border-spacing: 0; }
    td { vertical-align: top; }
    /* =============================================================================
       Eric Meyer Reset Snippet
       ========================================================================== */
    /* http://meyerweb.com/eric/tools/css/reset/ */
    /* v1.0 | 20080212 */
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-size: 100%;
        vertical-align: baseline;
        background: transparent;   
    /* ==|== primary styles =====================================================
       Author:
       ========================================================================== */
    body {
        max-width: 49.6875em;
        text-align: center;
        margin: auto;
        #container{
        text-align: left;
        margin: auto;
    a {
            color: #6699CC;
            text-align:left;
            text-decoration:underline;
            border: none;   
        a:link { color: #6699CC;}
        a:visited { color: #6699CC;}   
        a:hover { color: #496793;}   
        a:active { color: #496793;}
    /* ==|== text styles ====================================================== */
    p{
        color:#444444;
        font-family:Verdana, sans-serif;
    h2{
        font-size:2.5em;
        line-height:1.25em;
        letter-spacing:.02em;
        color:#00274c;
        font-weight:bold;
        font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;   
    h3{
        font-size:1.5em;
        line-height:1.25em;
        letter-spacing:.02em;
        color:#00274c;
        font-weight:bold;
        font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;   
    h4{
        font-size:1.3125em;
        line-height:1.25em;
        letter-spacing:.02em;
        color:#00274c;
        font-weight:normal;
        font-family:Verdana, sans-serif;   
    h5{
        font-size:1.3125em;
        line-height:1.25em;
        letter-spacing:.02em;
        color:#00274c;
        font-weight: bold;
        font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;   
    /* ==|== navigation styles ====================================================== */
    /* Custom Nav */
    #navigation{
        margin:10px 20px 5px 20px;
        width:775px;
    #headerlink a:link { color: #666;}
    #headerlink a:visited { color: #666;}   
    #headerlink a:hover { color: #00274C;}   
    #headerlink a:active { color: #00274C;}   
    #headerlink li{
        font: .625em "Arial Narrow", sans-serif;
        display: inline;
        text-decoration: none;
        list-style-image:url(../images/blue_bullet.gif);
        letter-spacing:.08em;
    #headerlink a{
        text-decoration: none;
    #headerlink {
        padding: 2px 135px 0px 0px;
        float: right;
    .new {
        text-align:right;
        font: bold 1.175em "Arial Narrow", sans-serif;
        color:#8f9d4e;
        display:inline;
    #header {
        margin: 15px auto 0 auto;
        width:775px;
    #logoregion {
        width:775px;
        height: 91px;
        background:url(../images/header_small.gif) no-repeat 0 0;
    #contact{
        font: bold .75em/1.35em sans-serif;
        color: #919194;
        padding: 10px 135px 0 0px;
        float: right;
        text-align:right;
    .nav-border-right{
        border-right: 1px solid #6699cc;
    #logo {
        padding: 32px 0 0px 8px;
        float: left;
    #mainnav {
        width: 100%; width: 775px;
        height: 28px;
    .navigation-text{
        text-align: center;
        font-weight:bold;
        font-size:.75em;
        font-family: sans-serif;
        letter-spacing:.01em;
        padding-top:2px;}
    .navigation-controls {width: 100%;}
    .navigation-controls li {margin: 0 0 0 0px; float:left; display: inline-block; zoom: 1; *display: inline; list-style:none;}
    .navigation-controls li:first-child {margin: 0;}
    .navigation-controls li a {color: #00274c; text-align:center; width: 129px; height: 28px; display: block; background: url(../img/main_navigation_tab.gif) no-repeat 0 0; cursor: pointer; text-decoration:none;}
    .navigation-controls li a:hover {background-position: 0 -28px; color: #00274c; }
    .navigation-controls li a.active {background-position: 0 -28px; color: #00274c;  cursor: default; }
    #nav a:link { color: #000000;}
    #nav a:visited { color: #00274C;}   
    #nav a:hover { color: #919194;}   
    #nav a:active { color: #919194;}   
    #nav li{
        list-style-type: none;
        display: inline;
    div#nav a{
    float: left;
    text-decoration:none;
    padding-top: 2px;
    padding-right: 15px;
    /* ==|== slideshow styles ====================================================== */
    #slideshow {width: 100%; width: 775px; margin: 0 16px; }
    #slideone{
        width:60%;}
    .gold{
        color:#d79b00;}
    .white{
        color:#fff;}
    .underline{
        text-decoration:underline;}
    /* ==|== main styles =========================================================== */
    /* ==|== main content column styles ======================================================= */
    #main{
        background:url(../img/body_bg.jpg) no-repeat 0 0;
        width: 775px;
        height: 885px;
        display:inline-block;
        margin-top: 90px;
        padding: 30px 20px 0px 20px;
        background:url(../img/body_bg.jpg) no-repeat 0 0;
        width: 795px;
        display:inline-block;
        margin-top: 90px;
        padding: 30px 0px 0px 0px;
    #maincontent{
        height: 885px;
        padding: 0px 20px;
    /* ==|== banner styles ====================================================== */
    #banner{
        font-size:1.3125em;
        line-height:1.25em;
        letter-spacing:.02em;
        font-weight: bold;
        font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
        height: 70px;
        width: 755px;
        margin: 0px 0px 0px -10px;
        padding: 0px 20px 20px 20px;
        -moz-border-radius-topleft: 2px;
        -moz-border-radius-topright: 2px;
        -webkit-border-top-left-radius: 2px;
        -webkit-border-top-right-radius: 2px;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        -khtml-border-top-left-radius: 2px;
        -khtml-border-top-right-radius: 2px;
        background-color: #496793;
        background-image: url(../img/banner_bg.gif);
        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#496793), to(#2c5079));
        background-image: -webkit-linear-gradient(top, #496793, #2c5079);
        background-image:    -moz-linear-gradient(top, #496793, #2c5079);
        background-image:     -ms-linear-gradient(top, #496793, #2c5079);
        background-image:      -o-linear-gradient(top, #496793, #2c5079);
    #leftbanner{
        float: left;
        padding-top:20px;}
    .bluedropshadow {
        color:#00274c;
        text-align:left;
        text-shadow: 1px 1px 1px #6882a4;}
    #bannerdivision{
        float: left;
        padding: 16px 20px 0 30px;}
    #rightbanner{
        float: right;
        padding-top:20px;
    #emailbutton{
        float: left;
        padding: 5px 0px 0px 0px;
    #or{
        float: left;
        padding: 13px 25px 10px 20px;}
    #callus{
        color:#ffffff;
        width: 180px;
        text-align:right;
        text-shadow: 1px 1px 1px #00274c;
        float: right;}
    #bannerbottom{
        height: 20px;
        background:url(../img/banner_bottom.jpg) no-repeat 0 0;
        width: 795px;
        margin: 0px 0px 0px -10px;
    /* ==|== left column styles ======================================================= */
    #leftcol{
        float: left;
        width: 485px;
    #introduction{
        padding: 15px;
        margin: 10px 30px 30px 30px;
        width: 390px;
        background-color:#FFFFFF;
        border: 1px solid #ededed;}
    #twitterfeed{
        text-align:right;
        margin: 30px;
        width: 415px;
    #twitterlogo{
        text-align:left;
        padding:37px 0 0 160px;
        height: 78px;
        background:url(../img/mpay_twitter_bird.png) no-repeat 0 0;
    .tweet {
        padding: 1px 0px 1px 0px;
        margin: 7px 0;
        text-align:left;
        font-family: Verdana, sans-serif;
        font-size:.75em;
        line-height:1.75em;
    .timestamp {
        text-align:right;
        font-weight: normal;
        color:#8f9d4e;
    .viewall {
        padding: 12px 0 0 0;
    /* ==|== right column styles ====================================================== */
    #rightcol{
        float: right;
        width: 290px;
    #mediacenter{
        margin: 10px 30px 50px 30px;
    #medialinks{
        padding: 10px 0 0 0;
    .mediaicons{
        vertical-align:middle;
        padding: 0px 10px 0 0;
    .medialinks{
        vertical-align:middle;
        padding: 10px 0 0 0;
    #viewall {
        padding: 12px 0 0 0;
    #affandawards{
        margin: 50px 5px 23px 14px;
    #affandawardstitle{
        margin: 0px 25px 0px 16px;
    #affandawardsframe{
        margin: 20px 0 0 0;
        padding: 27px 40px 50px 29px;
        background:url(../img/flash_bg.png) no-repeat 0 0;
    #socialmedia{
        margin: 23px 30px 30px 30px;
    #reachout{
        float:left;
        font-size:1.875em;
        line-height:1.25em;
        color:#8f9d4e;
        font-weight:bold;
        font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;   
    #socialarrow{
        float: right;
        padding: 20px 0 0 0;
    #socialicons{
        float: left;
        padding: 15px 0 0 0;
    .socialmediaicons{
        padding: 0 5px 0 0;
    /* ==|== footer styles =

  • DW reformats code to double-space all lines

    I have often had the experience that DW (currently CS3, but
    this has happened in earlier versions as well) double-spaces all
    the code in a document that was not previously double-spaced. That
    is, opening a document that previously displayed normally with no
    double-spaces (except where I had placed them) suddenly opens with
    an extra blank line between every line, including a second blank
    line between other double-spaces. Sample code below.
    How can I reverse this effect? Is there any way to select all
    the code and delete the extra blank lines at once? I find it very
    hard to read the code and find what I'm looking for when it's all
    double-spaced, but it's very tedious to remove the spaces line by
    line.
    Any ideas? Thank you!
    sample snippet of suddenly double-spaced code:
    <table width="95%" border="0" cellspacing="0"
    cellpadding="2">
    <tr>
    <td width="49%" bgcolor="#CCAEAE"><img
    src="images/header_title.gif" alt="Lab Acquisition Services"
    width="324" height="100" /></td>
    <td width="574" rowspan="2" bgcolor="#CCAEAE"><div
    align="right"><img src="images/bostonskyline.jpg" alt="Boston
    skyline" width="574" height="125"
    /></div></td></tr>
    <tr>
    <td width="100%" nowrap="nowrap"
    bgcolor="#CC0000"><div align="right"
    class="tagline"><span class="style1">Top-Quality
    Refurbished Lab Equipment    
    </span></div></td>
    </tr>
    </table>

    Oh cool! Thanks again; this has been a big help for a
    niggling, annoying, couldn't-figure-it-out, problem! :-)
    Have a great day.
    quote:
    Originally posted by:
    Newsgroup User
    > Now, I just need to figure out
    > how to find out the hosting server's OS
    http://netcraft.com -->link for
    "what's that site running"
    Alan
    Adobe Community Expert, dreamweaver
    http://www.adobe.com/communities/experts/

  • Dreamweaver cs6 problems

    Hi.
    I am making a login form inside a float right div,
    now wen i am on split or design view it displays normal as you can see on thsi image link
    :http://prntscr.com/1w8wh4
    but wen i preview on browser or live view its uge like this omage links:
    http://prntscr.com/1w8vpz
    can anyone tell me what the problem could be?

    html:
    <div id="log_in">
            <form action="Web_site_Back_End/dashboard.html" method="POST">
            <table>
            <tr><td><label>Admin. Login</label></td> <td><input name="user" type="text" size="50px" value="User name" maxlength="50" id="user" width="50px"></td><td><label>Password</label></td> <td><input name="password" type="password" value="password" size="50px" maxlength="8" id="password" width="50px"></td></tr>
      <tr><td></td><td></td><td></td><td><input type="submit" name="log_in_button" value="Login" ></td></tr>    
            </table
         </form>
    css(fluid grid layout and boilerplate:
    boilerplate.css:
    @charset "utf-8";
    @import url("../../webfonts/Magenta_BBT/stylesheet.css");
    * HTML5 ✰ Boilerplate
    * What follows is the result of much research on cross-browser styling.
    * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
    * Kroc Camen, and the H5BP dev community and team.
    * Detailed information about this CSS: h5bp.com/css
    * Dreamweaver modifications:
    * 1. Commented out selection highlight
    * 2. Removed media queries section (we add our own in a separate file)
    * ==|== normalize ==========================================================
    /* ===================================================================== ========
       HTML5 display definitions
       ===================================================================== ===== */
    article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
    audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
    audio:not([controls]) { display: none; }
    [hidden] { display: none; }
    /* ===================================================================== ========
       Base
       ===================================================================== ===== */
    * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
    * 2. Force vertical scrollbar in non-IE
    * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
    html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
    body { margin: 0; font-size: 13px; line-height: 1.231; }
    body, button, input, select, textarea {
              font-family: Tahoma, Geneva, sans-serif;
              color: #003;
              font-size: 18px;
              font-weight: normal;
              margin-top: 2%;
              margin-left: 3px;
              height: 30px;
              width: 50px;
    * Remove text-shadow in selection highlight: h5bp.com/i
    * These selection declarations have to be separate
    * Also: hot pink! (or customize the background color to match your design)
    /* Dreamweaver: uncomment these if you do want to customize the selection highlight
    *::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
    *::selection { background: #fe57a1; color: #fff; text-shadow: none; }
    /* ===================================================================== ========
       Links
       ===================================================================== ===== */
    a { color: #00e; }
    a:visited { color: #551a8b; }
    a:hover { color: #06e; }
    a:focus { outline: thin dotted; }
    /* Improve readability when focused and hovered in all browsers: h5bp.com/h */
    a:hover, a:active { outline: 0; }
    /* ===================================================================== ========
       Typography
       ===================================================================== ===== */
    abbr[title] { border-bottom: 1px dotted; }
    b, strong { font-weight: bold; }
    blockquote { margin: 1em 40px; }
    dfn { font-style: italic; }
    hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
    ins { background: #ff9; color: #000; text-decoration: none; }
    mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
    /* Redeclare monospace font family: h5bp.com/j */
    pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
    /* Improve readability of pre-formatted text in all browsers */
    pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
    q { quotes: none; }
    q:before, q:after { content: ""; content: none; }
    small { font-size: 85%; }
    /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
    sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
    sup { top: -0.5em; }
    sub { bottom: -0.25em; }
    /* ===================================================================== ========
       Lists
       ===================================================================== ===== */
    ul, ol {
              height: auto;
              width: auto;
              margin-top: 1em;
              margin-right: 0;
              margin-bottom: 1em;
              margin-left: 0;
              padding-top: 0;
              padding-right: 0;
              padding-bottom: 0;
              padding-left: 40px;
    dd { margin: 0 0 0 40px; }
    nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
    /* ===================================================================== ========
       Embedded content
       ===================================================================== ===== */
    * 1. Improve image quality when scaled in IE7: h5bp.com/d
    * 2. Remove the gap between images and borders on image containers: h5bp.com/e
    img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
    * Correct overflow not hidden in IE9
    svg:not(:root) { overflow: hidden; }
    /* ===================================================================== ========
       Figures
       ===================================================================== ===== */
    figure { margin: 0; }
    /* ===================================================================== ========
       Forms
       ===================================================================== ===== */
    form {
              margin: 0;
              height: auto;
              width: auto;
    fieldset { border: 0; margin: 0; padding: 0; }
    /* Indicate that 'label' will shift focus to the associated form element */
    label { cursor: pointer; }
    * 1. Correct color not inheriting in IE6/7/8/9
    * 2. Correct alignment displayed oddly in IE6/7
    legend { border: 0; *margin-left: -7px; padding: 0; }
    * 1. Correct font-size not inheriting in all browsers
    * 2. Remove margins in FF3/4 S5 Chrome
    * 3. Define consistent vertical alignment display in all browsers
    button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
    * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
    * 2. Correct inner spacing displayed oddly in IE6/7
    button, input { line-height: normal; *overflow: visible; }
    * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
    table button, table input { *overflow: auto; }
    * 1. Display hand cursor for clickable form elements
    * 2. Allow styling of clickable form elements in iOS
    button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
    * Consistent box sizing and appearance
    input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
    input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
    input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
    * Remove inner padding and border in FF3/4: h5bp.com/l
    button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
    * 1. Remove default vertical scrollbar in IE6/7/8/9
    * 2. Allow only vertical resizing
    textarea { overflow: auto; vertical-align: top; resize: vertical; }
    /* Colors for form validity */
    input:valid, textarea:valid {  }
    input:invalid, textarea:invalid { background-color: #f0dddd; }
    /* ===================================================================== ========
       Tables
       ===================================================================== ===== */
    table {
              border-collapse: collapse;
              border-spacing: 0;
              float: right;
              height: auto;
              width: auto;
    td { vertical-align: top; }
    /* ==|== primary styles =====================================================
       Author:
       ===================================================================== ===== */
    /* ==|== non-semantic helper classes ========================================
       Please define your styles before this section.
       ===================================================================== ===== */
    /* For image replacement */
    .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
    .ir br { display: none; }
    /* Hide from both screenreaders and browsers: h5bp.com/u */
    .hidden { display: none !important; visibility: hidden; }
    /* Hide only visually, but have it available for screenreaders: h5bp.com/v */
    .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
    /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
    .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
    /* Hide visually and from screenreaders, but maintain layout */
    .invisible { visibility: hidden; }
    /* Contain floats: h5bp.com/q */
    .clearfix:before, .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { zoom: 1; }
    /* ==|== print styles =======================================================
       Print styles.
       Inlined to avoid required HTTP connection: h5bp.com/r
       ===================================================================== ===== */
    @media print {
      * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
      a, a:visited { text-decoration: underline; }
      a[href]:after { content: " (" attr(href) ")"; }
      abbr[title]:after { content: " (" attr(title) ")"; }
      .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
      pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
      thead { display: table-header-group; } /* h5bp.com/t */
      tr, img { page-break-inside: avoid; }
      img { max-width: 100% !important; }
      @page { margin: 0.5cm; }
      p, h2, h3 { orphans: 3; widows: 3; }
      h2, h3 { page-break-after: avoid; }
    style.css:
    @charset "utf-8";
    @import url("../../webfonts/Magenta_BBT/stylesheet.css");
    /* Simple fluid media
       Note: Fluid media requires that you remove the media's height and width attributes from the HTML
       http://www.alistapart.com/articles/fluid-images/
    img, object, embed, video {
              /* [disabled]max-width: 100%; */
              width: 90%;
    /* IE 6 does not support max-width so default to width 100% */
    .ie6 img {
              width:100%;
              Dreamweaver Fluid Grid Properties
              dw-num-cols-mobile:                    4;
              dw-num-cols-tablet:                    9;
              dw-num-cols-desktop:          12;
              dw-gutter-percentage:          25;
              Inspiration from "Responsive Web Design" by Ethan Marcotte
              http://www.alistapart.com/articles/responsive-web-design
              and Golden Grid System by Joni Korpi
              http://goldengridsystem.com/
    /* Mobile Layout: 480px and below. */
    body{
              width:inherit;
              min-width:480px;
              height:auto;
              margin-left:auto;
              margin-right:auto;
              margin-top: 0px;
              margin-bottom: 0px;
        padding:0px;
              background:#FFF;
    .gridContainer {
              width:inherit;
              height:auto;
              min-width:480px;
              padding:0px;
              margin-left:auto;
              margin-right:auto;
              margin-bottom: 0px;
              margin-top: 0px;
              border:0px thin #FFF;
              background:#FFF;
              color: #006;
              clear: none;
              float:none;
              background-color:#FFC;
    #header {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #nav {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: none;
    #slideshow {
              clear: both;
              float: left;
              margin-left: auto;
              margin-right: auto;
              width: 100%;
              height: auto;
              display: block;
              border-top-width: 2px;
              border-right-width: 2px;
              border-bottom-width: 2px;
              border-left-width: 2px;
              border-top-style: solid;
              border-right-style: solid;
              border-bottom-style: solid;
              border-left-style: solid;
              border-top-color: #999;
              border-right-color: #999;
              border-bottom-color: #999;
              border-left-color: #999;
              background-color:#FFF;
    #content {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #footer {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
              min-height:200px;
              height:auto;
    #logo {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 100%;
              display: block;
    #log_in {
              clear: none;
              float:right;
              margin-left: 5.2631%;
              width:auto;
              height:auto;
              display: block;
    #row1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    .row1style{
              width:auto;
              text-align:left;
    #span1 {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 100%;
              display: block;
    #span2 {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 100%;
              display: block;
    #span3 {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 100%;
              display: block;
    #row2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:600px;
              display: block;
    #f1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:155px;
              height:auto;
              display: block;
    #f2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:60px;
              height:auto;
              display: block;
    #copyright {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 73.6842%;
              display: block;
              margin-top: 1%;
              margin-right: 1%;
              margin-bottom: 1%;
    #privacy_terms {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 73.6842%;
              display: block;
              margin-top: 1%;
              margin-right: 1%;
              margin-bottom: 1%;
    #bottom_logo {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width:25%;
              display: block;
              margin-top: 1%;
              margin-right: 1%;
              margin-bottom: 1%;
    #mobilenav {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    .minimal_biz_admin_link{
              text-decoration: none;
              font-family: "Magenta BBT";
              color: #666;
              font-size: 28px;
              display:inline;
    .row1_h2{
              font-family: "Times New Roman", Times, serif;
              color: #006;
              font-size: 28px;
              text-align: left;
              text-decoration: none;
              display: inline;
              margin-left:auto;
              margin-right:auto;
              width:90%;
    hr {
              display: block;
              height: 3px;
              border: 0;
              border-top:2px solid #F93;
              margin-left: auto;
              margin-right: auto;
              padding: 0;
              color: #F93;
              clear: none;
              float: left;
              width: 80%;
              margin-top: 1%;
              margin-bottom: 1%;
    #description {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #follow_us_social {
              clear: none;
              float: left;
              margin-left: 5.2631%;
              width: 100%;
              display: block;
    /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
    @media only screen and (min-width: 481px) {
    body{
              width:inherit;
              min-width:481px;
              height:auto;
              margin-left:auto;
              margin-right:auto;
              margin-top: 0px;
              margin-bottom: 0px;
              padding:0px;
              background:#FFF;
    .gridContainer {
              width:inherit;
              height:auto;
              min-width:481px;
              padding:0px;
              margin-left:auto;
              margin-right:auto;
              margin-bottom: 0px;
              margin-top: 0px;
              border: 0px none #FFF;
              background:#FFF;
              color: #006;
              clear: none;
              float:none;
              background-color:#FFC;
    #header {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #nav {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: none;
    #slideshow {
              clear: both;
              float: left;
              margin-left: auto;
              margin-right: auto;
              width: 100%;
              height: auto;
              display: block;
              border-top-width: 2px;
              border-right-width: 2px;
              border-bottom-width: 2px;
              border-left-width: 2px;
              border-top-style: solid;
              border-right-style: solid;
              border-bottom-style: solid;
              border-left-style: solid;
              border-top-color: #999;
              border-right-color: #999;
              border-bottom-color: #999;
              border-left-color: #999;
              background-color:#FFF;
    #content {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #footer {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
              min-height:400px;
              height:auto;
    #logo {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 100%;
              display: block;
    #log_in {
              clear: none;
              float: right;
              margin-left: 2.2727%;
              width:auto;
              height:auto;
              display: block;
    #row1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    .row1style{
              width:auto;
              text-align:left;
    #span1 {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 100%;
              display: block;
    #span2 {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 100%;
              display: block;
    #span3 {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 100%;
              display: block;
    #row2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:600px;
              display: block;
    #f1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:355px;
              height:auto;
              display: block;
    #f2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:40px;
              height:auto;
              display: block;
    #copyright {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 43.1818%;
              display: block;
    #privacy_terms {
              clear: both;
              float: left;
              margin-left: auto;
              width: 100%;
              display: block;
              margin-right: auto;
    #bottom_logo {
              clear: both;
              float: left;
              margin-left: 0;
              width: 25%;
              display: block;
    #mobilenav {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    .row1_h2{
              font-family:"Times New Roman", Times, serif;
              color:#006;
              font-size:30px;
              text-align:left;
              text-decoration:none;
              margin-left:auto;
              margin-right:auto;
              width:90%;
    .minimal_biz_admin_link{
              text-decoration: none;
              font-family: "Magenta BBT";
              color: #666;
              font-size: 30px;
    hr {
              display: block;
              height: 3px;
              border: 0;
              border-top:2px solid #F93;
              margin-left: auto;
              margin-right: auto;
              padding: 0;
              color: #F93;
              clear: none;
              float: left;
              width: 80%;
              margin-top: 1%;
              margin-bottom: 1%;
    #description {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #follow_us_social {
              clear: none;
              float: left;
              margin-left: 2.2727%;
              width: 100%;
              display: block;
    /* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
    @media only screen and (min-width: 769px) {
    body{
              width:inherit;
              min-width:769px;
              height:auto;
              margin-left:auto;
              margin-right:auto;
              margin-top: 0px;
              margin-bottom: 0px;
              padding:0px;
              background:#FFF;
    .gridContainer {
              width: 92%;
              min-width: 769px;
              max-width: 1232px;
              padding: 1%;
              border: 0px none #FFF;
              color: #006;
              background-color: #FFF;
              height: auto;
              clear: none;
              float: none;
              margin-bottom: 0px;
              margin-top: 0px;
              background-color:#FFC;
    #header {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #nav {
              clear: both;
              float: left;
              margin-left: auto;
              width: 100%;
              display: block;
              padding: 0%;
              background-color: #FFF;
              height: auto;
              margin-right: auto;
              margin-top: 1%;
              margin-bottom: 2%;
    #slideshow {
              clear: both;
              float: left;
              margin-left: auto;
              margin-right: auto;
              width: 100%;
              height: auto;
              display: block;
              border-top-width: 2px;
              border-right-width: 2px;
              border-bottom-width: 2px;
              border-left-width: 2px;
              border-top-style: solid;
              border-right-style: solid;
              border-bottom-style: solid;
              border-left-style: solid;
              border-top-color: #999;
              border-right-color: #999;
              border-bottom-color: #999;
              border-left-color: #999;
              background-color:#FFF;
    #content {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #footer {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
              min-height:500px;
              height:auto;
    #logo {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 32.2033%;
              display: block;
              margin-top: 20px;
              margin-right: auto;
              margin-bottom: 10px;
    #log_in {
              clear: none;
              float:right;
              margin-left: 1.6949%;
              width: auto;
              display: block;
              margin-right: 1%;
    #row1 {
              clear: both;
              float: left;
              width: 100%;
              display: block;
              margin: 1%;
              height: auto;
    .row1style{
              width:auto;
              text-align:left;
    #span1 {
              clear: none;
              float: left;
              margin-left: 1%;
              width: 30%;
              display: block;
              margin-top: 0px;
              margin-right: 0px;
              margin-bottom: 0px;
    #span2 {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 32.2033%;
              display: block;
              margin:1%;
    #span3 {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 32%;
              display: block;
              margin:1%;
    #row2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:600px;
              display: block;
    #f1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:455px;
              height:auto;
              display: block;
    #f2 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              min-height:40px;
              height:auto;
              display: block;
    #copyright {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 32.2033%;
              display: block;
    #privacy_terms {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 100%;
              display: block;
    #bottom_logo {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 25%;
              display: block;
    #mobilenav {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    .minimal_biz_admin_link{
              text-decoration: none;
              font-family: "Magenta BBT";
              color: #666;
              font-size: 36px;
    .row1_h2{
              font-family:"Times New Roman", Times, serif;
              color:#006;
              font-size:36px;
              text-align:left;
              text-decoration:none;
              margin-left:auto;
              margin-right:auto;
              width:90%;
    hr {
              display: block;
              height: 3px;
              border: 0;
              border-top:2px solid #F93;
              margin-left: auto;
              margin-right: auto;
              padding: 0;
              color: #F93;
              clear: none;
              float: left;
              width: 80%;
              margin-top: 1%;
              margin-bottom: 1%;
    #description {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #LayoutDiv1 {
              clear: both;
              float: left;
              margin-left: 0;
              width: 100%;
              display: block;
    #follow_us_social {
              clear: none;
              float: left;
              margin-left: 1.6949%;
              width: 100%;
              display: block;
    /* Desktop Layout: min of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
    @media only screen and (min-width: 1232px) {
    body{
              width:inherit;
              min-width:1232px;
              height:auto;
              margin-left:auto;
              margin-right:auto;
              margin-top: 0px;
              margin-bottom: 0px;
              padding:0px;
              background:#FFF;
    .gridContainer {
              float:none;
              width:92%;
              height: auto;
              max-width: 1232px;
              padding: 0px;
              margin-left:auto;
              margin-right:auto;
              border: 0px none #FFF;
              color: #006;
              margin-bottom: 0px;
              margin-top: 0px;
              background-color:#FFF;
              background-color:#FFC;
    #header {
              clear: none;
              float: none;
              margin-left: 0;
              width: 100%;
              display: block;
              height: auto;
    #nav {
              clear: both;
              float: left;
              margin-left: auto;
              width: 100%;
              display: block;
              padding: 0%;
              background-color: #FFF;
              height: auto;
              margin-right: auto;
              margin-top: 1%;
              margin-bottom: 2%;
    #slideshow {
              clear: both;
              float: left;
              margin-left: auto;
              margin-right: auto;
              width: 100%;
              height: auto;
              display: block;
              border-top-width: 2px;
              border-right-width: 2px;
              border-bottom-width: 2px;
              border-left-width: 2px;
              border-top-style: solid;
              border-right-style: solid;
              border-bottom-style: solid;
              border-left-style: solid;
              border-top-color:#999;
              border-right-color: #999;
              border-bottom-

Maybe you are looking for

  • Regex \\d* vs \\d\\d

    I have this issue with regex. String s = "10 apples 20 oranges 30 pears"; String regx = "(\\d*\\s[a-z]*)*"; When I use the above pattern in any regular expression code for the given string 's', "10 apples 20 oranges 30 pears" is matched If I change r

  • Err -36 on download?  Support express lane broken.

    On a recent iTunes Store download the progess got to essentially 100% (as far as I can see), but then "err -36" popped up. Everytime I restart this download, it seems to keep the existing download data and ends up with the same error after a pause. T

  • Problems to sync after Upgrade Touch 4G

    Hi folks, right after upgrade my Ipod Touch 4G to iOS 5 I experience major problem with syncing my IPod with ITunes (Also updated) In most tries Itunes tells me that it cannot connect properly with the IPod and I need to restore it. This happens with

  • Areca 1882x speed drop with a BBU - expected?

    Anyone using an Areca ARC-1882x RAID controller with a BBU (Battery Backup Unit)? If so, any difference in performance with / without BBU, and did you have to change any settings? Here is what I am seeing on a client's Mac Pro with a CineRAID 12-bay

  • TODATE function

    Hi, when i use todate function in the logical column TODATE(Core."Fact - HR - Payroll".PAY_ITEM_AMT, Core."Date"."Year") getting the following error. Query Status: Query Failed: [nQSError: 22046] To use TODATE function, the query level ('Year, Fiscal