Huge tracts of white space padding in topics

Mostly whenever there is a javascript call, like for a fixed
sized popup. This is no a huge problem, but it seems that this also
causing trailing spaces after the link to disappear and that is a
problem.

After working with Peter offline, here is what we've come up
with. I'm quoting from an email Peter sent me:
"As far as I recall, I just did two things.
First do a Find and Replace to remove all the
<!--begin--> comments. I did that using EditPadPro, a
text editor.
That tool also allows regular expressions in its Search and
Replace function.
I created one that found many lines but it was not the right
expression so I manually removed what it missed. Since then I found
the correct expression is as below with a replace of nothing. Do
backup your work first as regular expressions can fix things in
seconds, and break them even quicker.
^p$
This link may help.
UltraEdit
article
Text editors will only allow you to do this to one file at a
time.
PowerGrep will allow you to do the same thing across multiple
files.
I repeat, these tools are dangerous so make sure you have
backups."
I've used the find and replace tool in RH with the strings
above and it seems to work fairly well. I'll probably use FAR on
all the project files in a copy of my projects and hope I don't
blow anything up.

Similar Messages

  • Why is there a huge white space to the right of the board when I play Lexulous on Facebook?

    I play Lexulous (a form of Scrabble) on Facebook. For months now, whenever I play the game, there is a huge white space to the right of the board, like a whole other window. Only with this app. I tried another browser, same thing, and it also does it on my laptop (MacBook Pro). I asked the Lexulous help desk and attached a screenshot; they had no idea what would cause that to happen. I asked a couple of my regular opponents and they are not seeing it. It's really annoying because if I accidentally touch my mouse to the bottom scroll bar, the board slides offscreen to the left.
    Sorry if this is the wrong forum for this question, but I'd like to fix it.

    If you are using Safari to connect to Facebook, try this on one of the Macs.
    From the Safari menu bar click Safari > Preferences then select the Extensions tab.
    If there are any installled, turn that OFF, quit and relaunch Safari and try that game.

  • White space between header and main content

    Hello all! I have a 25-27px white space between my header and
    main content. I read through fixes in the forum and took out any
    height that would effect this gap. I still can't get rid of this
    white space. Your help is greatly appreciated! Here's the Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    </script>
    <meta http-equiv="Content-Type" content="text/html;
    charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: #666666;
    margin: 0; /* it's good practice to zero the margin and
    padding of the body element to account for differing browser
    defaults */
    padding: 0;
    text-align: center; /* this centers the container in IE 5*
    browsers. The text is then set to the left aligned default in the
    #container selector */
    color: #000000;
    .oneColElsCtrHdr #container {
    width: 46em; /* this width will create a container that will
    fit in an 800px browser window if text is left at browser default
    font sizes */
    background: #FFFFFF;
    margin: 0 auto; /* the auto margins (in conjunction with a
    width) center the page */
    border: 1px solid #000000;
    text-align: left; /* this overrides the text-align: center
    on the body element. */
    .oneColElsCtrHdr #header {
    padding-top: 0;
    padding-right: 0px;
    padding-bottom: 0;
    padding-left: 0px;
    background-color: #FFFFFF;
    .oneColElsCtrHdr #header h1 {
    margin: 0; /* zeroing the margin of the last element in the
    #header div will avoid margin collapse - an unexplainable space
    between divs. If the div has a border around it, this is not
    necessary as that also avoids the margin collapse */
    padding: 0px 0; /* using padding instead of margin will
    allow you to keep the element away from the edges of the div */
    .oneColElsCtrHdr #mainContent {
    background: #FFFFFF;
    padding-top: 0;
    padding-right: 0px;
    padding-left: 0px;
    .oneColElsCtrHdr #footer {
    padding: 0 10px; /* this padding matches the left alignment
    of the elements in the divs that appear above it. */
    background:#DDDDDD;
    .oneColElsCtrHdr #footer p {
    margin: 0; /* zeroing the margins of the first element in
    the footer will avoid the possibility of margin collapse - a space
    between divs */
    padding: 0px 0; /* padding on this element will create
    space, just as the the margin would have, without the margin
    collapse issue */
    .style4 { font-family: "Fiolex Girls", "Arial Narrow";
    color: #FF0000;
    font-size: xx-large;
    font-style: italic;
    .style6 {color: #FF0000}
    .style7 { color: #000000;
    font-size: x-small;
    .style9 {color: #FF0000; font-family: Arial, Helvetica,
    sans-serif; }
    -->
    </style>
    <script src="SpryAssets/SpryMenuBar.js"
    type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css"
    rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    #apDiv1 {
    position:static;
    width:525px;
    height:250px;
    z-index:1;
    float: left;
    border-bottom-color: #000000;
    border-bottom-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-color: #000000;
    #apDiv3 {
    position:static;
    width:500px;
    height:0px;
    z-index:1;
    left: 465px;
    top: 410px;
    float: right;
    .style14 {
    font-size: medium;
    font-style: italic;
    font-weight: normal;
    .style15 {font-size: small}
    -->
    </style>
    <link href="p7hscroller/s7/p7HSM07.css" rel="stylesheet"
    type="text/css" media="all" />
    <script type="text/javascript"
    src="p7hscroller/p7hsmscripts.js"></script>
    <style type="text/css">
    <!--
    #apDiv7 {
    position:static;
    width:737px;
    height:0px;
    z-index:2;
    bottom: 0px;
    border-bottom-style: solid;
    border-bottom-width: thin;
    .style16 {font-size: x-small}
    -->
    </style>
    <!-- Do not remove the line below!!! It is required for
    the XML Flash Slideshow v3. -->
    <script type="text/javascript"
    src="slideshow.js"></script>
    </head>
    <body class="oneColElsCtrHdr">
    <div id="container">
    <div id="header">
    <pre><span
    class="style4">US-AsianMates</span><span
    class="style6">.com</span> <strong><span
    class="style9">JOIN FOR FREE <span
    class="style7">OR</span> MEMBER LOG
    IN</span></strong>
    </pre>
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li>
    <div align="center"><a href="#"
    class="style16">HOME</a> </div>
    </li>
    <li>
    <div align="center"><a href="#"
    class="style16">ABOUT US</a></div>
    </li>
    <li>
    <div align="center"><a href="#"
    class="style16">WHY JOIN US?</a> </div>
    </li>
    <li>
    <div align="center"><a href="#"
    class="style16">VISA SUPPORT</a></div>
    </li>
    <li>
    <div align="center" class="style16"><a
    href="#">EVENTS</a></div>
    </li>
    </ul>
    <pre><!-- end #header -->
    </pre>
    </div>
    <div id="mainContent">
    <div id="apDiv1"><img
    src="Images/Outdoor_Bride1.jpg" alt="Bride" name="Bride"
    width="525" id="Bride" /></div>
    <p> </p>
    <p><br>
    </p>
    <pre> 
    </pre>
    <table width="200" border="1" align="left">
    <tr>
    <td><img src="Romantic_Kiss.jpg" alt="VISA"
    name="VISASUPPORT" width="200" id="VISASUPPORT" /></td>
    </tr>
    <tr>
    <td><img src="Surfing_At_Home.jpg" alt="JOIN"
    name="WHYJOIN" width="200" id="WHYJOIN" /></td>
    </tr>
    </table>
    <pre></pre>
    <div id="apDiv3">
    <div align="center">
    <div align="left">
    <pre class="style14"> <strong>LIVING
    PROOF</strong>
    <span class="style15">&quot;12 YEARS AGO I WENT TO
    THE PHILIPPINES IN HOPES
    OF FINDING MY FUTURE WIFE. 11 YEARS LATER,
    I AM HAPPILY MARRIED! WE ALSO HAVE AN ENERGETIC
    5 YEAR OLD SON! DREAM IT, LIVE IT! IT CAN
    HAPPEN TO YOU ON US-ASIANMATES.COM
    CHRIS&quot;</span></pre>
    </div>
    </div>
    </div>
    <pre> </span>
    </pre></pre>
    <p><!-- end #mainContent -->
    <br>
    <pre>
    </pre>
    <div id="apDiv7"></div>
    <div align="center">
    <pre><!-- Begin XML Flash Slideshow v3 -->
    <script type="text/javascript">
    // <![CDATA[
    XMLFlashSlideshow_v3({swf:'slideshow.swf',w:'580',h:'140',redirect:'',usePreloader:'true', xml:'slideshow_data0.xml',preventCache:'true',disableMultipleXML:'false',initXML:'%3C?xml% 20version=%221.0%22%20encoding=%22utf-8%22?%3E%3Cslideshow%20version=%223%22%3E%3Cstyles%3 E%3CPreloader%20label=%22Loading%20%7BN%7D%2525%22%20iconColor=%22#666666%22%20iconAlpha=% 2270%22%20iconWidth=%2250%22%3E%3C/Preloader%3E%3CPreloaderLabel%20font=%22Verdana%22%20si ze=%2210%22%20color=%22#666666%22%20bold=%22false%22%3E%3C/PreloaderLabel%3E%3CBackground% 20backgroundColor=%22#FFFFFF%22%20backgroundAlpha=%22100%22%20bevelColor=%22#FFFFFF%22%20b evelStrength=%2270%22%20borderWidth=%222%22%20borderColor=%22#000000%22%3E%3C/Background%3 E%3CLoaderAnimation%20type=%22circle%22%20color=%22#FFFFFF%22%20alphaBackground=%2220%22%2 0alphaInner=%2240%22%20frameWidth=%222%22%20width=%2250%22%20height=%2250%22%3E%3C/LoaderA nimation%3E%3CDataLoader%20useAnimation=%22true%22%20useLabel=%22true%22%20labelPlacement= %22bottom%22%20fadeOutDuration=%22400%22%20textFormat=%22loader_text%22%3E%3C/DataLoader%3 E%3C/styles%3E%3Clocalization%3E%3Ctext%20orig=%22Loading%20Data...%22%20local=%22Loading% 20Data...%22%3E%3C/text%3E%3C/localization%3E%3Cfonts%3E%3Cfont%20id=%22loader_text%22%20n ame=%22Pixelade%22%20embed=%22true%22%20size=%2213%22%20color=%22#666666%22%20bold=%22fals e%22%20selectable=%22false%22%20align=%22left%22%3E%3C/font%3E%3C/fonts%3E%3C/slideshow%3E '});
    // ]]>
    </script>
    <!-- End XML Flash Slideshow v3 -->
    </pre>
    </div>
    <pre> 
    </pre>
    <pre> </pre><!-- -->
    <pre> </pre>
    </div>
    <div id="footer">
    <p>Footer</p>
    <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1",
    {imgDown:"SpryAssets/SpryMenuBarDownHover.gif",
    imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

    "phillychris" <[email protected]> wrote in
    message
    news:[email protected]...
    > Yep, it was the 1 pre tag creating the gap. So why is
    this page a
    > disaster, Tim?
    Just because something is created in DW CS3 doesn't mean it's
    not a
    disaster, any more than using DeWalt power tools guarantees
    that my
    carpentry won't be a complete mess. The software is not a
    replacement for
    skills. It is a tool; your workflow and understanding of HTML
    and CSS is
    what allows you to use DW effectively.
    So why did I call this page a disaster? When I see all that
    extra markup,
    spans, and inline tags, I shudder. It's way too hard to
    troubleshoot. You're
    not doing nearly enough with descendant selectors; instead,
    most of your
    code is inline, despite a huge CSS file.
    Just one example: individual li tags with div align="center"
    inside of them.
    Way overkill. If you're centering all the li text in a given
    list, control
    it with CSS and kill all that extra markup.
    E.g.
    .MenuBarHorizontal li { text-align:center; }
    In fact, if all there is in that .MenuBarHorizontal is the
    list, you don't
    even need to specify the list in the CSS. Just do:
    .MenuBarHorizontal { text-align:center; }
    Now you don't need div tags inside your li at all.
    And if all of those a tags in that menu are going to be
    .style16 class,
    don't specify it on each link. In fact, don't even have a
    .style 16 class.
    Heck, since it's just specifying font size, you don't need to
    target the a
    tag at all. Just add font-size:x-small; to the
    .MenuBarHorizontal ruleset I
    gave you above.
    The above are just examples from a quick glance at your code.
    On the whole,
    your markup and approach to styles are largely wasting the
    power and point
    of CSS.
    In addition, several styles spanned onto one line of text...
    a sure sign
    that either you are using far too many styles to make design
    sense, or else
    you've got styles that overlap each other.
    Here's my advice: Until you get a better handle on CSS, don't
    style things
    as you go. Forget styles altogether at the start. Create a
    very clean HTML
    markup and put ID and class selectors on things you know will
    need them.
    Preferably, place the HTML elements in the order you would
    want your page
    read if styling did not even exist, nesting elements where
    necessary.
    After you have created all the HTML structure, then go back
    and style the
    elements via CSS only. You will end up with less page weight
    and far cleaner
    code to decipher, not simply in terms of length but in terms
    of conflicts
    and redundancies.
    If you're really insistent on styling things as you go, at
    least do this:
    don't create a new style every time you want to accomplish
    something. Create
    CSS rules for IDed containers and container classes. Then as
    you go along
    and are about to create a style, ask yourself where you are
    and what all
    this new rule needs to apply to. Specify the rule there,
    under the selector
    you've already created. Then you won't have .style1 -
    .style16 like you do
    now, and you won't have all that inline mess of code to sort
    through.
    Finally - as you create your CSS, discipline yourself to
    avoid style spans.
    They are necessary on the odd occasion, but very rarely.
    Think semantically
    (i.e. purpose of the style point you're making at a given
    time).
    For example, if you're tempted to create a span in order to
    put something in
    bold red, ask yourself: "Why?" Generally, it means you want
    to place special
    emphasis or strength on that. Well, in that case you don't
    need a span. You
    need to be using the proper tag, such as <em>
    (emphasis) or <strong>. Then
    you can style that tag in CSS. That way, what you have in
    your page actually
    makes sense apart from the style, and as a bonus you can
    apply or edit your
    style easily.
    Tim G.
    http://www.pactumweb.com
    http://www.shortordersite.com
    Be smart:
    http://www.pactumweb.com/client/tips.php

  • I am having trouble with the position of my header image across browsers. white space above it in safari, pc, and crome then all to the right in firefox.

    nydogworks.net
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>NYDogWorks Long Island Dog Training and Behavior</title>
    <meta name="description" content="Serving all of Long Island, Nassau & Suffolk. NYDogWorks specializes in dog training, dog behavior, and puppy training.">  
    <meta name="keywords" content="dog training, long island dog training, dog trainer, long island dog obedience, puppy training classes">
    <link href="css/mainstyle.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script><!-- Beginning of compulsory code below -->
    <link href="css/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
    <link href="css/default.advanced.css" media="screen" rel="stylesheet" type="text/css" />
    <!--[if lt IE 7]>
    <script type="text/javascript" src="js/jquery/jquery.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.dropdown.js"></script>
    <![endif]-->
    <!-- / END -->
    <link href="css/overlay-apple.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery.tools.min.js"></script>
    <style>
      div.apple_overlay h2 {
      margin:10px 0 -9px 0;
      color:#222;
      font-weight:bold;
      font-size:14px;
      div.black h2 {
      color:#222;
      #apple {
      margin-top:10px;
      float: left;
      width: 250px;
      padding-right: 10px;
      #apple img {
      background-color:#fff;
      padding:2px;
      border:1px solid #ccc;
      margin:2px 5px;
      cursor:pointer;
      -moz-border-radius:4px;
      -webkit-border-radius:4px;
      body {
      margin-right: auto;
      margin-left: auto;
    </style>
        <!--[if lt IE 7]>
      <style>
      div.apple_overlay {
      background-image:url(http://static.flowplayer.org/tools/img/overlay/overlay_IE6.gif);
      color:#fff;
      /* default close button positioned on upper right corner */
      div.apple_overlay div.close {
      background-image:url(http://static.flowplayer.org/tools/img/overlay/overlay_close_IE6.gif);
      </style>
      <![endif]--><script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script><script type="text/javascript">
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    </script>
    <script type="text/javascript">
    var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-26177215-1']);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    </head>
    <body onload="MM_preloadImages('images/nydogworks-logo-hover.png','images/training-services-on. jpg','images/behavior-therapy-on.jpg','images/off-leash-training-on.jpg')">
    <div id="wrapper"> <div id="header">
      <div id="logoBox"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/nydogworks-logo-hover.png',1)"><img src="images/nydogworks-logo.png" alt="NY Dogworks" name="Image3" width="280" height="200" border="0" id="Image3" /></a></div>
    <div id="slogan">Serving All of Long Island, Nassau &amp; Suffolk Counties<br />
      Also serving Manhattan, Brooklyn &amp; Queens
    </div><div id="emailBox">
        <h2><img src="images/calltogetstarted.png" width="473" height="74" alt="Call to get started" /></h2>
        </div><div id="mainNav"><!-- Beginning of compulsory code below -->
    <ul class="dropdown dropdown-horizontal" id="nav" name="nav">
      <li><a href="about-ny-dog-works.html">About Us</a></li>
      <li><a href="long-island-dog-training-programs.html" class="dir">Training Programs</a>
       <ul>
                <li><a href="basic-obedience.html">In Home Dog Training</a></li>
                <li><a href="dog-behavior-therapy.html">Behavior Therapy</a></li>
                <li><a href="board-and-train-dog-program.html">Board & Train Program</a></li>
                <li><a href="off-leash-training.html">Off Leash Training</a></li>
                <li><a href="puppy-training-program.html">Puppy Training</a></li>
    </ul>
      </li>
        <li><a href="dog-trainer-testimonials.html" class="dir">Testimonials</a></li>
      <li><a href="contact-long-island-dog-trainer.html" class="dir">Contact Us</a></li>
    </ul>
    <!-- / END --></div>
    </div>
      <div id="container">
    <div id="imgholder"><a href="long-island-dog-training-programs.html"><img src="images/main-header.jpg" alt="private dog training long island new york" width="951" height="416" border="0" /></a>
      <div id="program1"><a href="long-island-dog-training-programs.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/training-services-on.jpg',1)"><img src="images/training-services.jpg" alt="dog training services" name="Image6" width="315" height="137" border="0" id="Image6" /></a></div>
      <div id="program1"><a href="board-and-train-dog-program.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/boarding_training-on.jpg',1)"><img src="images/Boarding_training.jpg" alt="board and train dog program" name="Image5" width="315" height="137" border="0" id="Image5" /></a></div>
      <div id="program1"><a href="dog-behavior-therapy.html" onmouseout="MM_swapImgRestore()" onmouseover=
      "MM_swapImage('Image7','','images/Behavior_therapy2-on.jpg',1)"><img src="images/Behavior_therapy2.jpg" alt="behavior therapy" name="Image7" width="311" height="137" id="Image7" border="0" align="right" /></a></div>
    </div>
    <div id="pageContentNoside">
       <div id="sideSub">
         <h2>Dog Training Services<br />
           </h2>
         <ul id="subnav">
           <li><a href="basic-obedience.html">Basic Obedience</a></li>
           <li><a href="dog-behavior-therapy.html">Behavior Therapy</a></li>
           <li><a href="board-and-train-dog-program.html">Board & Train Program</a></li>
           <li><a href="off-leash-training.html">Off Leash Training</a></li>
           <li><a href="puppy-training-program.html">Puppy Training</a></li>
           </ul>
         <br />
         <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F NYDogWorks%2F219268038151244%3Ffref%3Dts&amp;width=248&amp;height=558&amp;show_faces=true& amp;colorscheme=light&amp;stream=true&amp;border_color=%23FFFFFF&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:248px; height:558px;" allowTransparency="true"></iframe>
         <p><br />
           </p>
         <p> </p>
         <p><img src="images/4449da18fc3aa2f249d17dc90ebd5531.jpg" width="145" height="136" /><br />
         </p>
         </div>
       <div id="mainContentFeature1">
         <h2>Welcome To NY Dogworks</h2>
         <p><img src="images/dog-breaking-through.jpg" alt="new york dog trainer" width="136" height="170" class="h_img_float_right" />Our private one on one training lessons are done at your home by a Professional Certified Trainer and Behavior Expert. The lessons are tailored to fit what you would like done with your puppy or adult dog. <br />
           <br />
           We use a humane, positive and scientifically sound approach that makes it easy for you and your dog to succeed. Our instructions are broken down into simple steps so that everyone can take part in the training and be able to practice as a family. <br />
           <br />
           <span class="employeeName">Call Today for a Free Consultation!!      </span></p>
         <p>Do not have the time or patients to do the Training? Well then NY DogWorks has the answer.. We now do <a href="board-and-train-dog-program.html">Board and Train Programs</a> at our lovely facility in the home of Owner &amp; Trainer Brian DeMartino. It is a 2 to 6 week program that is 100% guaranteed. Your dog will stay with us for no additional fee if we feel that he or she is not ready to graduate. This program can be for Puppy Training, Housebreaking, Socialization / Obedience &amp; Manners / Behavior problems such as Aggression, Anxiety, or Fears / Advanced Off Leash Training / Personal Protection and much more..</p>
         <p>We also <a href="board-and-train-dog-program.html">board dogs</a> at our facility if you are going away and want your family pet to be cared for 24/7 as if he or she was one of our own. Plenty of playtime, walks, individual attention, grooming if needed, comfortable sleeping areas with their own bed, and lots and lots of love.. </p>
         <p>Let us help you have the relationship that you and your dog deserve.. <br />
           <br />
           <strong>We are now accepting</strong><br />
           <img src="images/creditcards.jpg" width="228" height="43" alt="now accepting credit cards" /><br />
           <br />
           <br />
           </p>
         <p><br />
           </p>
         <p><br />
           <br />
          </div>
       <div id="mainContentFeature2">
         <form action="form.php" method="post" name="form2" id="form2"> <table width="279" border="0" cellpadding="2" cellspacing="2">
           <tr>
             <td width="273"><h2>Quick Contact</h2></td>
             </tr>
           <tr>
             <td class="mainContent">Your Name</td>
             </tr>
           <tr>
             <td><span class="style9">
               <input name="forname" type="text" class="colorfieldssmall" id="forname" size="20" />
               </span></td>
             </tr>
           <tr>
             <td class="mainContent">Your Email Address* (required)</td>
             </tr>
           <tr>
             <td><span class="style7 style9">
               <input name="admail" type="text" class="colorfieldssmall" id="admail" size="25" />
               </span></td>
             </tr>
           <tr>
             <td class="mainContent">Phone Number</td>
             </tr>
           <tr>
             <td><span class="style7 style9">
               <input name="phone" type="text" class="colorfieldssmall" id="phone" />
               </span></td>
             </tr>
           <tr>
             <td><span class="mainContent">Type of Dog Training</span></td>
             </tr>
           <tr>
             <td class="mainContent"><span class="style9">
               <select name="need" class="colorfieldssmall" id="need">
                 <option value="select one">select one</option>
                 <option value="Basic Obedience">Basic Obedience</option>
                 <option value="Behavior Therapy">Behavior Therapy</option>
                 <option value="Board and Train">Board and Train</option>
                 <option value="Off Leash Training">Off Leash Training</option>
                 <option value="Puppy Training">Puppy Training</option>
                 </select>
               </span></td>
             </tr>
           <tr>
             <td><span class="mainContent">Comments</span></td>
             </tr>
           <tr>
             <td><textarea name="comments" id="comments" cols="24" rows="8"></textarea></td>
             </tr>
           <tr>
             <td><div align="left">
               <input type="submit" name="submit" id="submit"  value="Submit" />
               </div>
               </td>
             </tr>
           </table></form>
         <h2><br />
           We are available in the following areas:</h2>
         <p>Long Island, Nassau county, Suffolk county, Manhattan, Brooklyn, Bronx, &amp; Queens.</p>
         <p>**We have pick up and drop off services for your pet for the boarding and boarding and training programs. <br />
           </p>
         <h2>Dog Training Testimonials<br />
           </h2>
         <p>Sending Otis to Brian for the board and train program was the best decision I ever made.  After being told Otis could not be helped and that he should be put down, I was devastated.  Otis has now been back from Brian's program for a few weeks and is extremely obedient and friendly.  He is the same puppy we brought home a couple years ago, but calmer and without any aggression.  We work on Otis' obedience daily as well as walk him and put him on the treadmill.   Thanks to Brian, our dog is happy-go-lucky and more approachable.  The list goes on and on of how Brian has helped the family, myself, and especially Otis.  If you are having issues with your dog, especially behavior and aggression problems, my advice to you is to trust Brian.  Your dog will be in good hands with a safe, reliable, responsible, dog lover that will treat your dog like his own.<br />
           <span class="testimonalName"><strong><br />
             Victoria Zilli<br />
             </strong></span><span class="mainContent">Long Island, New York</span><br />
           <br />
           <a href="dog-trainer-testimonials.html">Read more dog training testimonals</a><br />
           <br />
           <br />
          <br /></div>
       <div id="breadCrumbs">
         <p><a href="index.html">Home</a> &gt; Welcome to NY DogWorks New York's Premier Dog Training Company<br />
           <strong>Serving all of Long Island, Nassau &amp; Suffolk County, Manhattan, Brooklyn &amp; Queens</strong>        <br />
           </p>
         </div>
    </div>
        <div id="footer">
          <div id="footermenu">
          <div id="footermenu1">
          </div>
        </div>
       <div class="phoneNumber" id="copyright"> Copyright © 2014  NY DogWorks</div>
         <div class="websiteDesign" id="sitedesigner">Long Island Website Design by <a href="http://www.wetribet.com" title="Wet Ribet" target="_blank" class="medlink">Wet Ribet</a>     </div>
    </div>
    </div>
    </div>
    </body>
    </html>

    The issue with that white space is explained by the use of relative positioning of your menu. Remember that relative positioning visually allows you to move an element, but that its "shadow" or "foot print" is retained in the document flow. So it still takes up space where it originally flowed in your content, and this causes the header image to position itself the way it does. Turn off the relative positioning of the menu to see what I mean. A simple solution is to set the #header to relative positioning, and then apply absolute positioning to the menu.
    There are other issues with your code. Much of it can be simplified, and you should really stop using ID selectors from this point on, and predominantly use classes instead. The use of ID selectors ought to be limited as much as you can - they force you to write bloated convoluted code.
    Try to write DryCSS (Don't Repeat Yourself).
    Here is my somewhat cleaned up code. Notice I removed and simplified most of the css selectors. Some have no css properties at all anymore. And be careful that you cannot use re-use the same id selector in your html  code: it will not validate. #program1 must become .program1
    PS as always, please backup your files before applying these changes! Dreamweaver lacks a history/versioning feature!
    *, *:before, *:after {
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
              box-sizing: border-box;
    body {
        margin: 0 auto;
        background-color: #203610;
        font-family: "Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
        font-size: 100%;
        color: #333;
    #wrapper {
      background: url("../images/wrapbg.png") repeat-y scroll 0 0 rgba(0, 0, 0, 0);
      margin: 0 auto;
      width: 951px;
    #header {
      position: relative;
    #mainNav {
      background: url("../images/menubg.jpg") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
      bottom: 0;
      padding: 0 15px 0 25px;
      position: absolute;
      right: 0;
      width: 510px;
    .dropdown li { /* simplify .dropdown li !*/
      float: left;
      line-height: 2.2em;
    .dropdown a { /* simplify ul.dropdown li a !*/
      display: block;
      font-weight: bold;
      padding: 7px 12px;
    #container {
      background-color: #fff;
      border-top: 6px solid #6f9f49;
    #imgholder {
    .program1 { /* you CANNOT have multiple id selectors sharing the same name! Use classes!!! */
      float: left;
      width: 315px;
    rewrite this in your html:
    <div class="pageContentNoside">
        <div class="col-1-3 sideSub">
        <div class="col-1-3 mainContentFeature1">
        <div class="col-1-3 mainContentFeature2">
        <div class="breadCrumbs">
    </div>
    .col-1-3 {
      float: left;
      width: 33.3333%;
      padding: 25px 15px;
    #sideSub {
    #mainContentFeature1 {
      border-left: 1px solid #ccc;
      border-right: 1px solid #ccc;
    #mainContentFeature2 {
    #footer {
      clear: both;
      font-family: "Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
      font-size: 0.7em;
      height: 45px;

  • How to remove the white space that is now above the main images on each page?

    http://www.nydogworks.net
    Hello,
    I took over updating some things on my site from my web designer. The main images on each page used to be flush with the navigation bar on each page. Now there is a white space in between each one. Can you tell me how to remove the white space?
    <div id="container">
    <div id="imgholder"><img src="images/feature-aboutus.jpg" width="951" height="341" alt="" />
    </div>
    <div id="pageContentNoside">
       <div id="sideSub">
         <form action="form.php" method="post" name="form2" id="form2"> <table width="250" border="0" cellpadding="2" cellspacing="2">
           <tr>
             <td width="273"><h2>Quick Contact</h2></td>
             </tr>
           <tr>
             <td class="mainContent">Your Name</td>
             </tr>
           <tr>
             <td><span class="style9">
               <input name="forname" type="text" class="colorfieldssmall" id="forname" size="20" />
               </span></td>
             </tr>
           <tr>
             <td class="mainContent">Your Email Address* (required)</td>
             </tr>
           <tr>
             <td><span class="style7 style9">
               <input name="admail" type="text" class="colorfieldssmall" id="admail" size="25" />
               </span></td>
             </tr>
           <tr>
             <td class="mainContent">Phone Number</td>
             </tr>
           <tr>
             <td><span class="style7 style9">
               <input name="phone" type="text" class="colorfieldssmall" id="phone" />
               </span></td>
             </tr>
           <tr>
             <td><span class="mainContent">Type of Dog Training</span></td>
             </tr>
           <tr>
             <td class="mainContent"><span class="style9">
               <select name="need" class="colorfieldssmall" id="need">
                 <option value="select one">select one</option>
                 <option value="Basic Obedience">Basic Obedience</option>
                 <option value="Behavior Therapy">Behavior Therapy</option>
                 <option value="Board and Train">Board and Train</option>
                 <option value="Off Leash Training">Off Leash Training</option>
                 <option value="Puppy Training">Puppy Training</option>
                 </select>
               </span></td>
             </tr>
           <tr>
             <td> </td>
             </tr>
           <tr>
             <td><div align="left">
               <input type="submit" name="submit" id="submit"  value="Submit" />
               </div>
               </td>
             </tr>
           </table></form>
         <h2><br />
           Dog Training Services<br />
           </h2>
         <ul id="subnav">
           <li><a href="basic-obedience.html">Basic Obedience</a></li>
           <li><a href="dog-behavior-therapy.html">Behavior Therapy</a></li>
           <li><a href="board-and-train-dog-program.html">Board & Train Program</a></li>
           <li><a href="off-leash-training.html">Off Leash Training</a></li>
           <li><a href="puppy-training-program.html">Puppy Training</a></li>
           </ul>
         <br />
         <br />
         <br />
         </div>
      <div id="suggestPost"><a href="https://www.facebook.com/pages/NYDogWorks/219268038151244?fref=ts" ></a></div>
       <div id="mainContent">
         <h1 class="copyrightType">About NY DogWorks</h1><br />
         <h2> <span class="testimonal">The Owner of NYDogWorks</span>      </h2>
         <p><span class="copyrightType"><img src="images/dogpic.jpg" alt="Dog Behavior Therapy" width="183" height="275" class="h_img_float_right" /></span><strong>NYDogWorks L.L.C. is owned and operated by Master Certified Dog Trainer and Behavior Specialist Brian DeMartino. </strong><br />
           <br />
           His training is hands down the best out there. He has become one of the most sought after dog trainers throughout Long Island, Manhattan, &amp; New York.<br />
           <br />
           With over 15 years experience training and rehabilitating some of the toughest cases of dog behaviors. He’s Mastered the Art of teaching top knotch obedience and manners with outstanding results and has developed the most full proof and guaranteed system to fully housebreak any puppy or dog in the shortest amount of time.<br />
           <br />
           He is Certified in dog training and dog behavior and is an Official Evaluator for the American Kennel Club’s (C.G.C) Program.<br />
           <br />
           <br />
           <strong>All About NYDogWorks</strong><br />
           </p>
      <p><br />
      </p>
         <p>NYDogWorks Dog Education, is a Professional Dog Training Company offering dog training for puppies and older dogs through customized in-home training programs by Master Certified Trainers in Nassau County, Suffolk County, Hamptons, Long Island, Manhattan, Brooklyn, Bronx, Queens, Rockland County, Westchester County, Orange County, and Bergen County New Jersey. NYDogWorks offers obedience training, Housebreaking, Manners, socialization for your dog,  Puppy Training and Education, Behavior Therapy, Trick Training, Agility, Complete Off Leash Training, Sport Work, and Personal Protection Training. <br />
           <br />
           <strong><br />
             NYDogWorks Boarding &amp; Training Programs</strong><br />
           </p>
      <p><br />
        We offer boarding and training programs done in the home of owner, Brian DeMartino. This is a customized 2-6 week program to suit your dog's needs, great for someone who feels they do not have the time or patience to train or rehabilitate their dog at their home. This is a 100% guaranteed program. Your dog will stay with us for no additional charge if we feel that he or she has not learned all that was agreed upon. We guarantee that if there is any regression within 3 months of your dog being back home with you, he/she will come back to us for no additional charge.<br />
        <br />
        <a href="board-and-train-dog-program.html">View Boarding &amp; Training Programs</a></p>
         <p><br />
           </p>
         <p><br />
           <br />
      </div>
       <div id="breadCrumbs">
         <p><a href="index.html">Home</a> &gt;  NY DogWorks - About Certified Dog Trainer Brian DeMartino<br />
           <strong>Serving all of Long Island, Nassau &amp; Suffolk County, Manhattan, Brooklyn &amp; Queens</strong></p>
         </div>
    </div>
        <div id="footer">
          <div id="footermenu">
          <div id="footermenu1">
          </div>
        </div>
       <div class="phoneNumber" id="copyright"> Copyright © 2014  NY DogWorks</div>
         <div class="websiteDesign" id="sitedesigner">Long Island Website Design by <a href="http://www.wetribet.com" title="Wet Ribet" target="_blank" class="medlink">Wet Ribet</a>     </div>
    </div>
    </div>

    You should be able to add the following snippets of css to your stylesheet to fix that.
    In the mainstyle.css file, change...
    #imgholder {
    width: 950px;
    margin-top: 0px;
    padding: 0px;
    margin-right: auto;
    margin-left: auto;
    to
    #imgholder {
    width: 950px;
    margin-top: 0px;
    padding: 0px;
    margin-right: auto;
    margin-left: auto;
    overflow:hidden;

  • How do I remove the white space when importing a site from Flash?

    Okay, so I've dragged and dropped my created Flash site into Dreamweaver. One problem though, when I view it in a web browser (any web browser), it displays the site fine, however with a huge white space to the side of it. You'll see what I mean in this screenshot:
    What can I do then to remove that white space and make the site fill up the whole web browser? I've tried resizing it using a number of ways, but cannot seem to get it right.
    Thanks.

    function(){return A.apply(null,[this].concat($A(arguments)))}
    What can I do then to remove that white space and make the site fill up the whole web browser? I've tried resizing it using a number of ways, but cannot seem to get it right.
    You can do two things:
    1) Change the width of the container to 100%;  OR
    2) Post a link to your test page here (not the code nor picture) so that we can see ourselves what your code looks like.
    hth

  • IE 11 white space problem

    I created  a page with dreamweaver. It renders as intended in firefox but shows unwanted white space in ie 11.
    How do I fix this?
    Here is the page in firefox:
    Here is ie 11 page:
    Please respond to [email protected]
    Here is my code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background: #4E5869;
    margin: 0;
    padding: 0;
    color: #000;
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
    padding: 0;
    margin: 0;
    h1, h2, h3, h4, h5, h6, p {
    margin-top: 0;  /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
    padding-right: 15px;
    padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
    font-size: x-small;
    color: #FFF;
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
    border: none;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
    color:#414958;
    text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
    a:visited {
    color: #4E5869;
    text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
    text-decoration: none;
    color: #FFFFFF;
    /* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
    .container {
    width: 80%;
    max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
    min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
    background: #FFF; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
    height: 80%;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    .container .footer #fMisc div p {
    font-family: Verdana, Geneva, sans-serif;
    font-size: x-small;
    color: #FFF;
    /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
    .header {
    background: #6F7D94;
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the left instead of the right, simply float these columns the opposite direction (all left instead of all right) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
    float: right;
    width: 20%;
    padding-bottom: 64px;
    height: 100%;
    font-family: "Comic Sans MS", cursive;
    font-weight: bolder;
    font-size: x-large;
    border-top-width: 0%;
    border-right-width: 0%;
    border-bottom-width: 0%;
    border-left-width: 0%;
    background-color: #93A5C4;
    background-repeat: repeat;
    margin: 0px;
    overflow: hidden;
    .content {
    width: 80%;
    float: right;
    background-image: url(back1.gif);
    background-repeat: repeat;
    background-color: #CCC;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 10px;
    padding-left: 0px;
    height: 100%;
    overflow: hidden;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
    padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
    list-style: none; /* this removes the list marker */
    border-top: 1px solid #666; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
    margin-bottom: 15px; /* this creates the space between the navigation on the content below */
    ul.nav li {
    border-bottom: 1px solid #666; /* this creates the button separation */
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
    padding: 5px 5px 5px 15px;
    display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
    text-decoration: none;
    background: #8090AB;
    color: #000;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
    background: #6F7D94;
    color: #FFF;
    /* ~~ The footer ~~ */
    .footer {
    background: #6F7D94;
    position: relative;/* this gives IE6 hasLayout to properly clear */
    clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
    font-size: xx-small;
    color: #000;
    margin: 0px;
    padding-top: 10px;
    padding-right: 0;
    padding-bottom: 10px;
    padding-left: 0;
    /* ~~ miscellaneous float/clear classes ~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
    float: left;
    margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
    a {
    color: #FFF;
    .container .footer #fMisc div p a {
    color: #FFF;
    .container .footer div p {
    font-family: Verdana, Geneva, sans-serif;
    font-size: x-small;
    color: #FFF;
    .container .footer div p a {
    color: #FFF;
    p {
    font-size: xx-large;
    p {
    color: #000;
    font-size: x-large;
    .container .footer #fMisc div {
    font-size: x-small;
    .container .footer #fMisc div {
    color: #FFF;
    .container .content h1 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: x-large;
    font-weight: bold;
    color: #000;
    -->
    </style><!--[if lte IE 7]>
    <style>
    .content { margin-right: -1px; } /* this 1px negative margin can be placed on any of the columns in this layout with the same corrective effect. */
    ul.nav a { zoom: 1; }  /* the zoom property gives IE the hasLayout trigger it needs to correct extra whiltespace between the links */
    </style>
    <![endif]-->
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div class="container">
      <div class="header">
      <img src="Pictures/logo.gif" alt="Logo" name="Insert_logo" width="81" height="63" id="Insert_logo" style="background: #8090AB; display:block;" />
    <!-- end .header --></div>
      <div class="sidebar1">
       <img src="Pictures/back1.jpg" width="72" height="72" /><p> Cliff is an all breed AKC Registered Professional Dog Handler</p>
    <p><img src="Pictures/back1.jpg" width="72" height="72" /></p>
    <p><img src="Pictures/back1.jpg" width="72" height="72" /></p>
    <!-- end .sidebar --></div>
      <div class="content">
       <ul id="MenuBar1" class="MenuBarHorizontal">
         <li><a href="#">Home</a>      </li>
         <li><a href="#" class="MenuBarItemSubmenu">Kennel</a>
           <ul>
             <li><a href="#">Our Facility</a></li>
             <li><a href="#">Rates</a></li>
             <li><a href="#">Pictures</a></li>
           </ul>
         </li>
         <li><a class="MenuBarItemSubmenu" href="#">Show Handling</a>
           <ul>
             <li><a href="#">Info</a></li>
             <li><a href="#">Rates</a></li>
             <li><a href="Schedulefile:///S:/Homepage/calendar.html">Schedule</a></li>
    </ul>
         </li>
         <li><a href="#">Photo Gallery</a></li>
         <li><a href="#">About Me</a></li>
         <li><a href="#">Contact Me</a></li>
       </ul>
       <br />
        <h1 style="margin: 10px; clear: both; text-align:center; font-size: xx-large; font-family: Georgia, 'Times New Roman', Times, serif;">Clifford W. Steele </h1>
       <div style="text-align:center; font-size: xx-large;"> <img src="Pictures/Harley Champion001.jpg" alt="Harley Champion" width="530" height="423" border="0" /></div>
      <!-- end .content --></div>
      <div class="footer">
          <div style="float:right">
            <p> <a href="MAILTO:[email protected]" >Site Designed by Fredric M. Zipser</a><br />
           </p>
        </div>
        <div>
            <p>Clifford W. Steele  Professional Handler <br />
              1395 Rt. 6<br />
              Carmel, NY  10512-1627<br />
              United States<br />
              ph:(845) 225-2463<br />
              Cell:(845) 661-0010<br />
            <a href="MAILTO:[email protected]" >[email protected]</a></p>
        </div>
      <!-- end .footer --></div>
    <!-- end .container --></div>
    </script>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>

    Give <div class="container"> the same blue background color as your right side bar.
    You'll notice in IE some of the spacing for the rest of your page is slightly larger than in Firefox (browsers do that a lot if you aren't very, very specific about sizes). Because of that, your side bar isn't long enough to fill in the space on that side and the background color of the "container" <div> shows through.

  • Bottom White Space

    On my website you can see that there is white space at the bottom but it ends just short of the true bottom, is there anyway I can make this so white continues down all the way?
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" href="layout.css" ... />
    <meta name="google-site-verification" content="_Plh0Sn97-RFeQaAZFoZgv8tZ9Ap9FhMbNGy3eq3CeM" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Home</title>
    <style type="text/css">
    <!--
    body {
        font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
        background: #4E5869;
        margin: 0;
        padding: 0;
        color: #000;
        background-image: url(Pictures/1276207208635.jpg);
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
        padding: 0;
        margin: 0;
    h1, h2, h3, h4, h5, h6, p {
        margin-top: 0;     /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
        padding-right: 15px;
        padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
        font-size: xx-large;
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
        border: none;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
        color:#09F;
        text-decoration: none; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
    a:visited {
        color: #06F;
        text-decoration: none;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: none;
    /* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
    .container {
        width: 80%;
        max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
        min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
        background: #FFF;
        margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
        overflow: hidden; /* this declaration makes the .container clear all floated columns within it. */
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
        float: left;
        width: 20%;
        background: #93A5C4;
        padding-bottom: 10px;
    .content {
        padding: 10px 0;
        width: 60%;
        float: left;
    .sidebar2 {
        float: left;
        width: 20%;
        background: #93A5C4;
        padding: 10px 0;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
        padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
        list-style: none; /* this removes the list marker */
        border-top: 1px solid #666; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
        margin-bottom: 15px; /* this creates the space between the navigation on the content below */
        color: #FFF;
    ul.nav li {
        border-bottom: 1px solid #666; /* this creates the button separation */
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
        padding: 5px 5px 5px 15px;
        display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
        text-decoration: none;
        background: #8090AB;
        color: #000;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        background: #6F7D94;
        color: #FFF;
    /* ~~ miscellaneous float/clear classes ~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: right;
        margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the overflow:hidden on the .container is removed */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .container .content h1 {
        font-family: OCR A Extended;
    body,td,th {
        color: #000;
    -->
    </style><!--[if lte IE 7]>
    <style>
    .content { margin-right: -1px; } /* this 1px negative margin can be placed on any of the columns in this layout with the same corrective effect. */
    ul.nav a { zoom: 1; }  /* the zoom property gives IE the hasLayout trigger it needs to correct extra whiltespace between the links */
    </style>
    <![endif]-->
    <!--Analystics-->
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-19878287-1']);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script>
    <!--Iphone Redirect-->
    <script type="text/javascript" src="http://widgets.amung.us/tab.js"></script><script type="text/javascript">WAU_tab('tnvkzuebf877', 'right-upper')</script>
    <script type="text/javascript" src="http://hunterthornsberry.com/mobilejs.js"> if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
         if (document.cookie.indexOf("iphone_redirect=false") == -1) window.location = "http://hunterthornsberry.com/mobile.html";
    </script>
    </head>
    <body>
    <div class="wrapper">
    <div class="container" align="left">
      <div class="sidebar1">
        <ul class="nav">
          <li><img src="../../Pictures/TDLLOGO.png" width="172" height="129" /></li>     
          <li><a href="index.html">Home</a></li>      <li><a href="About.html">About Me</a></li>
          <li><a href="Blog.html">Personal Blog</a></li>
          <li><a href="tech.html">Tech Stuff</a></li>
          <li><a href="Projects.html">Projects</a></li>
          <li><a href="design.html">Design/Art</a></li>
          <li><a href="Contact.html">Contact</a></li>
        </ul>
        <p> <center><script type="text/javascript"><!--
    google_ad_client = "pub-9636713487359174";
    /* HunterThornsberry */
    google_ad_slot = "9954026781";
    google_ad_width = 160;
    google_ad_height = 600;
    //-->
    </script>
    <script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script></center></p>
      <!-- end .sidebar1 --></div>
      <div class="content">
        <center><h1>Home</h1>
          <p><strong><em>UNDER CONSTRUCTION</em></strong></p>
          <p>
            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550" height="400" id="FlashID" title="This is my life">
              <param name="movie" value="../../Intro.swf" />
              <param name="quality" value="high" />
              <param name="wmode" value="opaque" />
              <param name="swfversion" value="6.0.65.0" />
              <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
              <param name="expressinstall" value="../../Scripts/expressInstall.swf" />
              <param name="LOOP" value="false" />
              <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
              <!--[if !IE]>-->
              <object type="application/x-shockwave-flash" data="../../Intro.swf" width="550" height="400">
                <!--<![endif]-->
                <param name="quality" value="high" />
                <param name="wmode" value="opaque" />
                <param name="swfversion" value="6.0.65.0" />
                <param name="expressinstall" value="../../Scripts/expressInstall.swf" />
                <param name="LOOP" value="false" />
                <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
                <div>
                  <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                  <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                </div>
                <!--[if !IE]>-->
              </object>
              <!--<![endif]-->
            </object>
          </p>
          <p> </p>
        </center>
      </div>
      <div class="sidebar2" align="right">
    <script type="text/javascript"><!--
    google_ad_client = "pub-9636713487359174";
    /* Sky */
    google_ad_slot = "5228573680";
    google_ad_width = 120;
    google_ad_height = 600;
    //-->
    </script>
    <script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script>
      <!-- end .container --></div>
    <script type="text/javascript">
    <!--
    swfobject.registerObject("FlashID");
    //-->
    </script>
    </div>
    <!--Footer-->
    <div class="push"></div>
    <div class="footer">
    <p><center>Copyright (c) 2008</p>
    </div>
    </body>
    </html>

    Well its the 'footer' <div> and the <div> before that which need some attention.
    Add the below to your css styles:
    .footer {
    width: 80%;
    margin: 0 auto;
    background-color: #fff;
    .footer p {
    margin: 0;
    padding: 0;
    Then remove the "push" <div> completely:
    <div class="push"></div>
    <div class="footer">
    <p><center>Copyright (c) 2008</p>
    </div>
    To just leave:
    <div class="footer">
    <p><center>Copyright (c) 2008</p>
    </div>

  • White space between images

    I have 5 rollover images lined up beside each other in a
    table cell. I have reduced their borders to 0, the cell padding and
    cell spacing to 0 also. I even tried reducing the images padding
    and margin to 0. However, there is still a really thin line between
    each of the images that i want to get rid of (it's as if the images
    all have a small white border around them, but I've reduced their
    borders to 0).
    Here is what the code looks like:
    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td width="53">
    <div id="box">
    <p align="right"><img src="banner.jpg"
    name="banner" width="536" height="101" border="0" id="banner" />
    <a href="#" onmouseout="MM_swapImgRestore()"
    onmouseover="MM_swapImage('home','','Buttons/homebtnover.jpg',1)"><img
    src="Buttons/homebtnup.jpg" name="home" width="107" height="36"
    border="0" id="home" /></a><a href="#"
    onmouseout="MM_swapImgRestore()"
    onmouseover="MM_swapImage('theteam','','Buttons/theteambtnover.jpg',1)"><img
    src="Buttons/theteambtnup.jpg" name="theteam" width="107"
    height="36" border="0" id="theteam" /></a><a href="#"
    onmouseout="MM_swapImgRestore()"
    onmouseover="MM_swapImage('schedule','','Buttons/schedulebtnover.jpg',1)"><img
    src="Buttons/schedulebtnup.jpg" name="schedule" width="107"
    height="36" border="0" id="schedule" /></a><a href="#"
    onmouseout="MM_swapImgRestore()"
    onmouseover="MM_swapImage('gallery','','Buttons/gallerybtnover.jpg',1)"><img
    src="Buttons/gallerybtnup.jpg" name="gallery" width="107"
    height="36" border="0" id="gallery" /></a><a href="#"
    onmouseout="MM_swapImgRestore()"
    onmouseover="MM_swapImage('contact','','Buttons/contactbtnover.jpg',1)"><img
    src="Buttons/contactbtnup.jpg" name="contact" width="108"
    height="36" border="0" id="contact" /></a></p>
    </div> </td>

    .oO(Twinbird24)
    >It still doesn't work. I've even tried to just make a new
    document and just
    >place the rollover images beside each other in a row
    (horizontally). However,
    >even with the image's borders, padding, and margin set to
    0, there still seems
    >to be a really small space between the images.
    >
    > Here is a link to the rollover images, as you can see,
    there is that small
    >white space between the images:
    >
    http://www.arkdesigns.ca/untitled.html
    The gap I see is in the images themselves - the outermost
    right and
    bottom pixels are faded. There's no other gap between the
    images in
    Opera and IE 6.
    Micha

  • Remove XML Tags with White space.

    Hi All, I have a scenario like the below code where I have empty spaces in few columns of my tables. I create XML of the data and send it. There is a lot of code such and I can't add ISNULL() on each and every column. Is there any simple one line code working
    with the XML so that I can remove the tags with only empty spaces. TIA.
    DECLARE @xml1 VARCHAR(max)
    DECLARE @xml2 VARCHAR(max)
    set @xml1 = (SELECT 1 AS Col11, ' ' AS Col21, 'ABC' AS Col31 FOR XML RAW, ELEMENTS)
    set @xml2 = (SELECT 2 AS Col12, ' ' AS Col22, 'ABC' AS Col32 FOR XML RAW, ELEMENTS)
    DECLARE @xml xml;
    SET @xml = Cast('<ROOT>' + ISNULL(@xml1, '') + ISNULL(@xml2, '') + '</ROOT>' as xml)
    SET @xml.modify('delete //*[not(node())]');
    -- Some Way to Remove the XML Tags with Empty space here.
    select @xml as XMLString
    /* Output of the Above script.
    <ROOT>
    <row>
    <Col11>1</Col11>
    <Col21> </Col21> -- This XML Tag with a white space should be removed
    <Col31>ABC</Col31>
    </row>
    <row>
    <Col12>2</Col12>
    <Col22> </Col22> -- This XML Tag with a white space should be removed
    <Col32>ABC</Col32>
    </row>
    </ROOT>
    Welcome to MSDN Forums.
    Feel free to ask your questions and Please Note to Vote all helpful topics and
    Mark all answering posts.
    You Value Community's efforts and Community values your faith.
    - Arun Kumar Allu

    It would have helped if there had been a trim() function in XQuery.
    With some trial and error and inventive thinking I came up with this:
    <span style="color:Blue">SET</span> @xml.modify(<span style="color:#A31515">'delete //*[. <= " "]'</span>);
    As they say: it seems to work. But I leave no warranties.
    Erland Sommarskog, SQL Server MVP, [email protected]
    Wow Erland  this
    seems to work, I need to test it against my data and update on this. Thanks again.
    Welcome to MSDN Forums.
    Feel free to ask your questions and Please Note to Vote all helpful topics and
    Mark all answering posts.
    You Value Community's efforts and Community values your faith.
    - Arun Kumar Allu

  • Need a chrome and safari hack to eliminate white space, or?

    Hi,
    This page renders fine in IE8 and Firefox, but in Chrome and Safari there is white space before the Welcome bar.
    http://67.199.64.241/indexspry.asp
    Any thoughts?
    Thanks!
    Here is my CSS -- the styling for the section with the welcome bar is highlighted:
    margin:0;
    padding:0;
    body {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #F3D1D8;
    font-size: .75em;
    line-height: 2em;
    color: #323532;
    position: relative;
    margin: 0;
    padding: 0px;
    text-align:center; /* for IE5 */
    behavior: url("csshover3.htc"); /* makes hover class work in IE 6,7 and 8 */
    #container {
    width: 1000px;
    background: #fff;
    margin: 0 auto;
    text-align:left;
    # header {
    background: #fff;
    a {
    text-decoration: none
    /* Typography -------------------------------------------*/
    .textbold {
    font-weight: bold;
    .ital {
    font-style:italic;
    line-height: 1.2em;
    font-family: Georgia, "Times New Roman", Times, serif;
    /* Headings -------------------------------------------*/
    h1 {
    margin: 0; /* 2 does not bring it down -- nor does adding a border*/
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #323532;
    color: #F4F4F4;
    font-size: 2em;
    font-weight: bold;
    line-height: 2.5em;
    h2 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #4E2029; /*dark purple*/
    color: #f4f4f4;
    font-size: 1.5em;
    font-weight: bold;
    h3 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #D5647C; /*dusty rose*/
    color: #000000;
    font-size: 1em;
    font-weight: bold;
    h4 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    color: #323532;
    font-size: 1em;
    font-weight: bold;
    /* h5 is good for drawing a burgundy line */
    h5 {
    background-color: #4E2029;
    font-size: .5em;
    line-height: .5em;
    /* h6 is good for drawing a line the same color as the background */
    h6 {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #F3D1D8; /*pink*/
    color: #f4f4f4;
    font-size: .5em;
    font-weight: bold;
    border-top-width: medium;
    border-top-style: solid;
    border-top-color: #FFF;
    line-height: .5em;
    /* Links -------------------------------------------*/
    a:link {
    color: #d5647c;
    font-weight: bold;
    a:visited {
    color: #8A2488;
    font-weight: bold;
    a:hover {
    color: #684148;
    font-weight: bold;
    a:active {
    color: #CC0000;
    font-weight: bold;
    /* Top Navigation -------------------------------------------*/
    #navtop {
    margin:0 0 2px;
    padding: 0;
    background: #4E2029; /* dark purple, pms 504 */
    list-style-type: none;
    width: 1000px; /*used to be 684 */
    float: left; /*contain floated list items */
    #navtop li {
    margin: 0;
    padding: 0;
    float: left;
    margin-left: 0px;
    padding-left: 0px;
    background: #4E2029; /* dark purple, pms 504 */
    list-style-position: outside;
    #navtop a {
    float: left;
    width: 170px;
    color: #ffffff;
    text-decoration: none;
    line-height: 2.5;
    text-align: center;
    border-right: 1px solid #fff;
    font-weight: bold;
    #navtop #nav_don a {
    border: none; /* take out line after last menu item */
    #navtop a:hover {
    background: #D5647C; /* dusty rose, pms 702 */
    /* Lists ----------------------------------------------
    /* This accounts for brower differences in handling left margin indentation */
    ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    list-style-position: outside;
    li {
    background: url(/images/bulletpt.gif) no-repeat 0 9px;
    margin-left: 5px;
    padding-left: 15px;
    list-style-position: outside;
    /* other elements ------------------------- */
    #boxx {
    background: #323532; /*dark gray */
    width: 200px;
    float: right; /*contain floated list items */
    z-index: 10;
    padding: 0px 8px 0px 12px;
    border-bottom:3px solid #323532;
    border-top-width: 3 px;
    border-top-style: solid;
    border-top-color: #323532;
    line-height: 1.4em;
    margin: 2px;
    #boxx li {
    margin: auto;
    color: #424642; /*med gray */
    font-weight: bold;
    float: left; /* this section corrects IE whitespace bug */
    background: #F2DFE3; /*lt gray */
    list-style-position: outside;
    list-style-type: none;
    width: 185px;
    #boxx a {
    color: #4E2029;
    display: block;
    text-decoration: none;
    #boxx a:hover {
    background: #B85067; /* dark pink*/
    color: #FFFFFF;
    #search {
    float: right;
    width: 200px;
    padding: 0px 8px 0px 12px;
    border-bottom:3px solid #323532;
    border-top-width: 3 px;
    border-top-style: solid;
    border-top-color: #323532;
    margin: 2px;
    .graybox {
    margin: 15px 0 0 0;
    padding: 5px 0 0px 0;
    background:url(/images/graychecks.gif);
    .rosebox {
    margin: 15px 0 0 0;
    padding: 5px 0 0px 0;
    background:url(/images/rosechecks.gif);
    /* Need something for box styles, form styles and maybe graphical buttons. */
    .checklist {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    background-color: #ffffff;
    font-size: 0.75em;
    line-height: 1.2em;
    color: #323532;
    position: relative;
    margin: 0;
    padding: 0px;
    list-style-type: circle;
    .sig {
    font-family: "Comic Sans MS", cursive;
    font-weight: bold;
    /* from main2col.css =---- */
    margin:0;
    padding:0;
    /* Left Navigation-------------------------------------*/
    #navleft {
    /* position: absolute; */
    left:0;
    top: 185px;
    /*margin:0 0 -750px; */
    /*background: #323532; /* dark gray, pms 447 */
    /*width: 170px;
    color: #ffffff;
    font-weight: bold;
    float: left; /*contain floated list items */
    /*#navleft ul {
    list-style-type:none;
    list-style: none;
    margin: 0;
    padding: 0;
    /*#navleft li { */
    /* float: left; *//* this section corrects IE whitespace bug */
    /*width: 100%; */
    /*list-style-position: outside;*/
    /* position: relative;
    list-style-type:none;
    margin: 0;
    padding: 0;
    /*#navleft a {
    display: block;
    color: #ffffff;
    text-decoration: none;
    padding: 0 7px;
    line-height: 2.5;
    padding: 15 10 15 20;
    border-bottom:1px solid #fff;
    background: #4E2029; *//* dark purple, pms 504 */
    /*#navleft #nav_news a {
    border: none; *//* take out line after last menu item */
    #navleft a:hover {
    background: #D5647C;*/ /* dusty rose, pms 702 */ /*
    /* for submenus */
    /*#navleft ul ul ul {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    #optionalmenupicture {
    width: 14em;
    #navoptional {
    /*position: relative;
    left:0;
    top: 0;
    margin:0;
    padding: 0;  */
    background: #58DA2C; /*med lime green */
    list-style-type: none;
    width: 155px;
    color: #ffffff; /* white */
    font-weight: bold;
    float: left; /*contain floated list items */
    #navoptional li {
    margin: 2px;
    padding: 0;
    float: left; /* this section corrects IE whitespace bug */
    width: 100%;
    background: #D5647C; /*dark rose */
    list-style-position: outside;
    list-style-type: square;
    #navoptional a {
    display: block;
    text-decoration: none;
    padding: 0 10px;
    line-height: 2;
    border-bottom:1px solid #323532;
    /* #navoptional #nav_news a {
    border: none; /* take out line after last menu item */
    #navoptional a:hover {
    background: #4e2029; /* dark purple */
    /* Main Content ---------------------------------------*/
    #primaryContent {
    background: #fff;
    float: left;
    margin-left: 172px;
    padding: 0;
    position:relative;
    top: -334px;
    /* footer --------------------------------- */
    #footer {
    padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
    background:#ffffff;
    .hide {
    font-size: 0em;
    line-height: 0em;
    .box {
    margin: 15px 0 0 0;
    padding: 5px 0 0px 0;
    background:url(/images/ltchecks.gif);
    .mogul {
    font-family:Andale Mono, Trebuchet MS, Comic Sans MS, Impact;
    font-size: xx-small;
    /* Forms ---------------------- */
    input {
    background-color: #f5f5f5;
    color: #4E2029;
    font: Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
    textarea {
    background-color: #f5f5f5;
    color: #4E2029;
    width: 300px;
    height: 100px;
    font: Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
    /* from Adobe */
    .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page */
    float: left;
    margin-right: 8px;
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;

    You've got a bigger problem.  See attached screenshot from Firefox when text size is increased in browser (Zoom, text only)
    Start by using the code valiation tools below and fix reported errors.  90% of browser rendering problems are code related.  If your code is clean, chances are good that your pages will perform reasonably well in all the major browsers.
    HTML Validator - http://validator.w3.org 
    CSS Validator - http://jigsaw.w3.org/css-validator/  
    HTML & CSS Tutorials - http://w3schools.com/
    Conditional Comments are only recognized by MS Internet Explorer.  You can't use CCs to target other browsers.  But this is a moot point since your problem isn't caused by bugs in either Safari or Chrome.
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists
    www.alt-web.com/
    www.twitter.com/altweb
    www.alt-web.blogspot.com

  • Removing white space after Spry Menu Bar...

    I having a bit of a problem trying to remove a little white space after my Spry Menu bar, when I set it to 8.6em theres a little white space, when I set the width to 9.7 it goes too far, I changed it to 137 pixels, however in Firefox and IE, it messes up the layout.
    Also what do you do if there a different browsers, where some layouts are out of place, do you need to detect the browser with JS?

    The website is not live yet, everything is stored locally so heres the code: -
    HTML: -
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" type="text/css" href="website_style.css" />
    <title>My Website</title>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    </head>
    <body>
    <div id="wrapper">
      <div id="banner"></div>
      <div id="menu">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#">Home</a>      </li>
          <li><a href="#">Personal Profile</a></li>
          <li><a href="#">Education</a>      </li>
          <li><a href="#">Work Experience</a></li>
          <li><a href="#">Skills</a></li>
          <li><a href="#">Additional Info.</a></li>
          <li><a href="#">Referees</a></li>
        </ul>
      </div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    CSS: -
    @charset "utf-8";
    /* CSS Document */
    body{
        background-size:auto;
        background-repeat:no-repeat;
        background-color:#967255;
        padding: 5px;
    #wrapper {
        width:968px;
        background: #FFF;
        padding-left:0px;
        padding-right:0px;
        overflow:hidden;
        height: auto;
        border-top-left-radius:20px;
        border-top-right-radius:20px;
        margin:0 auto;
    #wrapper #banner {
        background-image:url(banner.gif);
        height: 100px;
        width: 968px;
        margin-left: auto;
    Spry Menu CSS: -
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: auto;
        font-family: abeatbyKai;
        height: auto;
        background-image: url(../paper.gif);
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
        z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 8.68em;
        float: left;
        height: 3em;
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 0em;
        margin-left: 0;
        padding-top: 0;
        padding-right: 0em;
        padding-bottom: 0;
        padding-left: 0px;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        z-index: 1020;
        cursor: default;
        width: 8.2em;
        position: absolute;
        left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
        left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
        width: 8.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
        position: absolute;
        margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        background-color: #EEE;
        color: #333;
        text-decoration: none;
        background-image: url(../paper.gif);
        padding-top: 0.5em;
        padding-right: 0.75em;
        padding-bottom: 1.5em;
        padding-left: 0.75em;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        background-color: #33C;
        color: #FFF;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
        background-color: #33C;
        color: #FFF;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarDown.gif);
        background-repeat: no-repeat;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarRight.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarDownHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarRightHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
        filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
            display: inline;
            f\loat: left;
            background: #FFF;

  • White space under table on page how to get rid of it

    I created a new page, inserted a table to fill the page and
    put in a background color. When I look at the page in Dreamweaver,
    there is no white space under the table at the bottom of the page.
    When I preview the page in a browser, the table ends about an inch
    from the bottom of the page and I have about an inch of white space
    under the table. Does anyone have an idea why this is happening?
    Thanks for any help you can give. I'm going crazy trying to
    get rid of it.
    Diane

    Fix up the errors with your html firstly - then see where you
    are at with
    the page....
    The first thing to do would be to get rid of the table
    heights - it's
    invalid and won't render cross browser anyway. Error:
    http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fhome.comcast.net%2F~moordian%2F
    PS: Are you working on a PC or a Mac?
    Nadia
    Adobe® Community Expert : Dreamweaver
    http://www.DreamweaverResources.com
    |Tutorials|SEO |CSS Templates
    http://www.csstemplates.com.au
    http://www.adobe.com/devnet/dreamweaver/css.html
    CSS Tutorials for Dreamweaver
    "diane7" <[email protected]> wrote in
    message
    news:efa1h5$o12$[email protected]..
    > When I am working on the page in Dreamweaver, I can't
    add content any
    > lower
    > than the gold bar at the bottom. In fact, none of the
    white under the
    > gold bar
    > shows up in Dreamweaver, when I'm working on the page.
    It only shows up
    > when I
    > preview it or publish it. That's why I'm so baffled. The
    gold bar should
    > be
    > the bottom of my index page but that white shows up in
    the published
    > version
    > underneath it. My page properties are set to 0 margins
    on all four sides
    > of
    > the page and the table is set to 0 padding and 0 cell
    spacing, so I don't
    > think
    > that's it.
    > Diane
    >

  • Extra White Space Around Header Graphic & NavBar

    I have a header graphic and Navigation Bar (rollover images)
    positioned inside a table. Unfortunately, there is about 1-2 pixels
    of white space on the left, right, and top of the header graphic.
    Same with the NavBar--there's 1-2 pixels of white space on the
    edges (left & right sides). By default, cell padding for the
    table is set to zero. If cell padding is set to zero, why am I
    seeing white space between the edge of the graphic and the edge of
    the table?
    You can see what I'm referring to here:
    http://newstartinvestment.com
    What is causing this extra white space, and how do I get rid
    of it?

    On 26 Mar 2007 in macromedia.dreamweaver, csbridges wrote:
    > I have a header graphic and Navigation Bar (rollover
    images)
    > positioned inside a table. Unfortunately, there is about
    1-2 pixels
    > of white space on the left, right, and top of the header
    graphic.
    > Same with the NavBar--there's 1-2 pixels of white space
    on the edges
    > (left & right sides). By default, cell padding for
    the table is
    > set to zero. If cell padding is set to zero, why am I
    seeing white
    > space between the edge of the graphic and the edge of
    the table?
    >
    > You can see what I'm referring to here:
    >
    http://newstartinvestment.com
    (Btw, I
    > don't like the yellow rollovers--they'll be removed
    shortly.)
    >
    > What is causing this extra white space, and how do I get
    rid of it?
    Personally, I thought that the white border was a feature,
    but... In
    addition to the cellpadding, add cellspacing:
    <table width="780" border="0" align="center"
    cellpadding="0"
    cellspacing="0" bordercolor="#000000" bgcolor="#FFFFFF">
    Joe Makowiec
    http://makowiec.net/
    Email:
    http://makowiec.net/contact.php

  • Change amount of white space between paragraphs

    I have a web page at
    http://lifopro.com/072506lifotrainingmaterials.html
    that has more white space between the paragraphs that I would like.
    Is there any way to decrease the white space between paragraphs?
    The code for the top part of the text is included.
    Thanks for your help.
    Paul

    thanks murray. 8^D
    "Murray *ACE*" <[email protected]> wrote
    in message
    news:[email protected]...
    > That would be margins you need to control, not padding.
    >
    > --
    > Murray --- ICQ 71997575
    > Adobe Community Expert
    > (If you *MUST* email me, don't LAUGH when you do so!)
    > ==================
    >
    http://www.dreamweavermx-templates.com
    - Template Triage!
    >
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    >
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    >
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    > ==================
    >
    >
    > "crash" <[email protected]> wrote in message
    > news:[email protected]...
    >> 1. Take out all of your font tags
    >> 2. Research archives for info on CSS
    >> 3. Control padding on paragraphs with css.
    >>
    >>
    >> --
    >> If you haven't already, you would be well served
    searching through the
    >> archives for the answer to your question. The
    archives can be found
    >> here:
    >>
    >>
    http://groups.google.com/group/macromedia.dreamweaver
    >>
    http://groups.google.com/group/macromedia.dreamweaver.appdev
    >>
    >>
    >> "Lewp01" <[email protected]> wrote
    in message
    >> news:[email protected]...
    >>>I have a web page at
    http://lifopro.com/072506lifotrainingmaterials.html
    >>>that
    >>> has more white space between the paragraphs that
    I would like. Is there
    >>> any
    >>> way to decrease the white space between
    paragraphs?
    >>>
    >>> The code for the top part of the text is
    included.
    >>>
    >>> Thanks for your help.
    >>> Paul
    >>>
    >>>
    >>> <p><font size="2" face="Verdana, Arial,
    Helvetica,
    >>>
    sans-serif"><strong> </strong>The primary
    reasons LIFO errors are
    >>> so
    >>> common are:</font></p>
    >>> <ol><li><font size="2"
    face="Verdana, Arial,
    >>> Helvetica, sans-serif"> Errors resulting from
    the use of spreadsheets
    >>> and
    >>> </font></li>
    >>> <li><font size="2" face="Verdana,
    Arial,
    >>> Helvetica,
    >>> sans-serif">Lack of understanding of LIFO IRS
    Regulations and basic LIFO
    >>> principles. </font></li>
    >>> </ol>
    >>> <p><font size="2" face="Verdana, Arial,
    >>> Helvetica,
    >>> sans-serif">One of the reasons for the latter
    is the lack of adequate
    >>> LIFO
    >>> training and reference materials especially as
    it relates to the IPIC
    >>> method.
    >>>
    >>
    >>
    >
    >

Maybe you are looking for

  • IPhone 4 calendar entries get duplicated for all day events

    Hi all, A new one, I have an iPhone 4 which is duplicating all day events for no reason. You can delete one of the events and then it promptly shows up again. The other two all day events for the same item can not be edited or deleted. They originall

  • 11.1.0.6.0 - 11.1.0.7 dbua error while upgrading

    hello all i'm attempting to upgrade 11.1.0.6.0 to 11.1.0.7 and once in dbua i'm at upgrade process 85%, and i'm receiving this error: database upgrade assistant: ORA-04043: Object XDB_DATASTORE_PROC does not exist , ignore | Abort i'm not too sure wh

  • 2 pricing conditions in PP

    Hi everyone, This is a RETURNS scenario. We create a Credit Memo Request (Sales Order type: CR) when the customer calls in for a Return and we make another Sales Order (Sales Order Type: RE) when the goods actually come in. A credit memo is created a

  • XML request in Flex WebService using ActionScript

    Hi, I'm having a problem with dumping the request XML. When I send XML request to a web service with soapUI, it gives me normal results, but when I try to do the same thing in Flash using Flex, the web sevice responds with a SOAP fault. This is basic

  • How to completely remove the excess footage from a trimmed clip?

    I'm sure there is a very basic answer for this, and I'm simply inexperienced. I just can't seem to find this exact problem stated anywhere. My issue involves time remapping. I'm working on a MacBook Pro, using dynamic link between Premiere Pro CC and