Help with alignment

i have dreamweaver cs4 to align text i was wondering if there is any other way instead of going into the css part of the properties panel, and right clicking, because i remember in dreamweaver cs3 the alignment of text was right in the properties part not in the css part of the properties.

You have asked this question before.  CS4 requires you to use the CSS properties panel because that is how modern web pages need to be styled  - with CSS not HTML.  If you start your projects using a pre-built stylesheet with all your text styles defined, this shouldn't be a problem.
http://www.w3schools.com/CSS/css_howto.asp
On the other hand, if you are avoiding CSS because you don't want to learn it, then CS4 is probably not the ideal tool for you.  Go back to using CS3.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists
www.alt-web.com/
www.twitter.com/altweb

Similar Messages

  • Help with alignment please

    I currently have one page on my web site that contains just one "box". In that box are about 16 items, each of which consists of a photo button and a few words of text to the right of the button. Each photo button links to a separate page of family photos. THE PROBLEM: Until recently all of these button with their associated text stayed in their correct positions. They still do in iWeb, but NOT actually on the web when visited. When viewed on the web via Safari the photo buttons still line up nicely along the right side of the "box", but as one scrolls down the buttons, the text that should be to the right of each button progressivley moves up to higher buttons rather than staying put. What have I done wrong, and how can I make this right? Thanks!!

    This is caused by the way iWeb interprets line height versus the way any given browser interprets line height. In iWeb it might look like it's all lined up, but when published, the browser then takes control of display and it often displays line height smaller than what iWeb does - it essentially compacts your text. You don't notice the small difference at the top, but you do as the text progresses.
    Max is on the right track I think, but I'd actually do this to totally eliminate the issue. For each picture you have, make an individual text box for the associated text. Align each text box to the top of each photo. This way the text always stays aligned to the photo. That just won't happen when it's all in one text box.
    By the way, great job of describing the situation. That certainly helps.

  • Help with alignment in Dreamweaver CS5

    Hello,
    I've tried to follow all the tutorials regarding alignment with wrappers etc... but I still can't get it right. Worse, what was right originally, ie.e the navbar went haywire too. I'm at a loss and would be very grateful is someone could help me out.
    Many thanks,
    Sylvie
    The website is:
    www.insanitydefensethemovie.com
    This is the CSS code:
    @charset "UTF-8";
    body {
        background-color: #000;
        margin:0 auto;
    #main_wrapper {
        position: relative;
        width:960px;
        margin:0 auto;
        top: 0px;
    #main_nav_bar {
        position:absolute;
        width:960px;
        height:60px;
        z-index:1;
        left:auto;
        right:auto;
        top:0;
    #front_image {
        position:absolute;
        width:960px;
        height:670px;
        z-index:1;
        left:auto;
        right:auto;
        top:60px;
    .overlay_social_media {
        position:absolute;
        top:731px;
        width:235px;
        height:47px;
        float: left;   
    #social_media {
        position:absolute;
        left:727px;
        top:22px;
        width:235px;
        height:47px;
        z-index:1;
        visibility: visible;
    #wrapper_video {
        width: 560px;
        position: absolute;
        height: 315px;
        margin-top: 380px;
        margin-right: 400px;
        left: 287px;
        top: 60px;
    #wrapper_appeal {
        width:212px;
        height:273px;
        margin-top:380px;
    #wrapper_paypal {
        position:relative;
        margin-left:30px;
        top:20px;
    .holder {
        position:absolute;
        width:960px;
        height:670px;
        top: 20px;
        left: 30px;
        width: 168px;
        left: 14px;
        top: 158px;
        left: 0px;
        top: 158px;
        top: 46px;
    .overlay {
        top:392px;
        position:absolute;
        background-image:url(../Images/home/appeal_bckgd.png);
        background-repeat:no-repeat;
        width:212px;
        height:273px;
        left: 45px;
    .overlay h1 {
        color:#F00;
        font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
        margin-left: 50px;
        margin-top: 30px;
    .overlay h3 {
        color:#FFF;
        font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
        text-align:center;
        font-size: 16px;
        margin-right: 10px;
        margin-left: 10px;
    .overlay paypal_button {
        position::absolute;
        margin-left: 50px;
    #apDiv2 {
        position:absolute;
        left:18px;
        top:790px;
        width:1266px;
        height:466px;
        z-index:2;
    #wrapper_copyright {
        position: relative;
        left:252px;
        top:452px;
        width:522px;
        height:22px;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 14px;
        color: #FFF;
        text-align: center;
        margin-top: 600px;
    .copyright {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 14px;
        color: #EEE;
        text-align: center;
    #Twitter_wrapper {
        position::relative;
        top:850px;
        bottom:600px;
    #Twitter_heads_wrapper {
        position:absolute;
        top: 765px;
        margin-left:8px;
        left: 3px;
        width: 699px;
        height: 17px;
    .twitter-header    {
        font-family:"Bebas Neue";
        color:#FFF;
        font-size:36px
    #Twitter_wrapper #twitter1 {
        position:absolute;
        top:850px;
        margin-left:8px;
        float: left;   
    #Twitter_wrapper #twitter2 {
        position:absolute;
        top:850px;
        margin-left:360px;
        float: left;   
    #social-media #twitter-feeds .twitter-header {
        font-family: "Bebas Neue";
        font-size: 14px;
        color: #FFF;
    #social-media #twitter-feeds #user-timelines .twitter_timeline {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #EEE;
    /* CSS Document */

    The best way to get any help here is by posting a link to the test
    page.  Code is not appropriate in cases like this.  People have to see
    what is happening before suggesting anything.
    Good luck.

  • Need Help with alignment  in JTextField

    I am having problem with text alignment in JTextField.
    I'm populating JTextfield with text pulled from database.
    Text is too long to fit in the jtextfield and the alignment is set to the right rather than the left.
    How can I set the alignment left, so that the first character of the string is shown?
    I've tried setHorizontalAlignmnet(JTextField.LEFT) but no luck.
    Can anyone help me in this.

    TrysetCaretPosition(0)db

  • Help with alignment of dynamic menu

    Hi.
    I can't for the life of me get the main meny (a bc dynamic menu) to align center on this site http://www.eaglerockfarm.com.au/home.htm. At the moment I've fudged it with a 350px left margin, but that only looks ok on smaller screens, larger ones, It's to the left and smaller, i.e an ipad, it's to the right.
    I have a div id in the css "nav2" with text-align:center, but when I inspect the element (q) in Firefox, it crosses out that line. I also tried putting in the text-align:center inline, but nothing seems to work...I am not a developer, but have an average understanding of css and html...
    Can anyone assist please?
    Thanks.

    Hello justasking506,
    To bring your main menu to center just change the div#nav2 to:
    div#nav2 {
        font-size: 14px;    height: 20px;
        margin: 0 auto;
        padding-bottom: 10px;
        padding-top: 10px;
        width: 633px;
    Here you can see that I've changed the margin to "0 auto", that will put auto margin on the left and right of the div. Now the width needed to be a little bigger to center the div.
    I would also suggest not using the default dynamic menu type. This is using tables to output your navigation. Instead I would suggest using the CSS(HTML Only) menu type, this will use an unordered list and will allow you to use your own css to position the navigation. I go over how the dynamic menus work in this video:
    http://bcgurus.com/tutorial/how-to-create-business-catalyst-dynamic-menus
    Hope this helps,
    Chad Smith | http://bcgurus.com/Business-Catalyst-Templates for only $7

  • Dreamweaver 8 help with aligning Layers

    Hi all
    I am completely stuck I want my layer AP (tag) to display in the center of my browser and any browser it displays in?????
    I need help please I don’t know how to set this to the center using CSS
    Thanks

    Fantastic
    Thanks a million for that, tried at diff screen resolutions and bang in the centre
    only thing is i want the page to not have a scroll down the right hand side
    I was trying to backspace the page back up as it only needs to be around 600 in height as this is the layer height??
    Any ideas
    Really appreciate the help BTW
    Code below
    <!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=iso-8859-1" />
    <title>home</title>
    <link href="background.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    #Layer1 #Layer2 {
    background-image: url(Images/460.gif);
    -->
    </style>
    <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_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];}}
    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>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    #Layer2 {
    width:602px;
    height:600px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 152px;
    margin-left: auto;
    .style2 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FFFFFF;
    -->
    </style>
    </head>
    <body class="background" id="Layer1" onload="MM_preloadImages('Images/Year_7_button_over.png','Images/Year_8_button_over.png', 'Images/OCR_Over.png')">
    <div id="Layer2">
      <div align="center"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('YEAR7','','Images/Year_7_button_over.png',1)"><img src="Images/Year_7_button.png" alt="YEAR&amp;" name="YEAR7" width="200" height="80" border="0" id="YEAR7" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Year8','','Images/Year_8_button_over.png',1)"><img src="Images/Year_8_button.png" alt="Year8" name="Year8" width="200" height="80" border="0" id="Year8" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('OCR','','Images/OCR_Over.png',1)"><img src="Images/OCR.png" alt="OCR" name="OCR" width="200" height="80" border="0" id="OCR" /></a></div>
      <p> </p>
      <p align="center" class="style2">Welcome to ICT </p>
      <p align="center" class="style2">Please click on the  button that you need </p>
      <p align="center" class="style2">If you are in year 7  click the year 7 button </p>
      <p align="center" class="style2">If you are in year 8  click the year 8 button </p>
      <p align="center" class="style2">If you are working on  OCR units click the OCR button</p>
      <p align="center" class="style2">SIMPLES!</p>
    </div>
    </body>
    </html>

  • Please help with aligning google button

    hi this is my website i have made,
    after making a few changes i have messed something up and now the google+ button has moved over to the right to much?
    i need to know how i can get the button to place above the facebook and twitter buttons where it was to begin with.
    www.uniquelawns.com
    many thanks Dave

    Run your page through the validator here and clean out the errors (except the two specific to the google code)
    http://validator.w3.org/
    That should make realigning an easier task.

  • Need help with aligning patterns

    I’m having trouble aligning a pattern, and I think I’m missing some basic concept.  I want to align a pattern to start at a particular point, but AI always seems to align it to the top left corner of the (page/artboard). I remember having this trouble in CS3, but I thought the problem had been addressed in CS5.
    My pattern is 1 sqin., and I want to create a strip starting 1/2 in from the top and 1/2 in from the left hand edge of a page.  According to the CS5 manual: “To adjust where all patterns in your artwork begin tiling, you can change the file’s ruler origin.” So I change the origin to (0.5in x, 0.5in y). But when I apply my pattern, it still aligns to the (0.0) origin.
    For example, if this is the original pattern:
    when I apply it to an area using (0.5, 0.5) as the origin, it gets applied like this:
    I’ve looked through my preferences and the only thing I found that might affect this was the “Transform Pattern Tiles” parameter, but changing this didn’t have any effect.
    What am I doing wrong? I can work around the problem in a couple of ways, but I don't want to go through extra steps if I don't have to.

    I’m having trouble aligning a pattern, and I think I’m missing some basic concept.  I want to align a pattern to start at a particular point, but AI always seems to align it to the top left corner of the (page/artboard). I remember having this trouble in CS3, but I thought the problem had been addressed in CS5.
    My pattern is 1 sqin., and I want to create a strip starting 1/2 in from the top and 1/2 in from the left hand edge of a page.  According to the CS5 manual: “To adjust where all patterns in your artwork begin tiling, you can change the file’s ruler origin.” So I change the origin to (0.5in x, 0.5in y). But when I apply my pattern, it still aligns to the (0.0) origin.
    For example, if this is the original pattern:
    when I apply it to an area using (0.5, 0.5) as the origin, it gets applied like this:
    I’ve looked through my preferences and the only thing I found that might affect this was the “Transform Pattern Tiles” parameter, but changing this didn’t have any effect.
    What am I doing wrong? I can work around the problem in a couple of ways, but I don't want to go through extra steps if I don't have to.

  • Help with Safari Alignment issue

    Hi everyone,
    Having some issues with aligning BC E-commerce product boxes in Safari.  Looks fine in Chrome & Firefox, but Safari it is stacking everything container.  Tried wrapping the Content Holder in a Div to solve it? Same thing.
    Chrome
    Firefox
    Safari - notice the boxes are all aligned to the left on top of the left box - looking for help to fix this!?
    Thanks,
    Aaron

    You have a cut n paste error or including the header twice multiple times in your HTML:
    View the source have a look at line 287 onward, you have a second header in your code:
    <!DOCTYPE html>
    <html class="html">
        <head>
    Edit: Actually you have it mutliple times not just one extra but 4 times.

  • Help with email alignment

    Hi Guys, looking for some help with center alignment of an email.
    Its center aligning fine in dreamweaver preview and in the preview of mail chimp, but when I sent it to Gmail it's aligned to the left.
    Any ideas why this is?
    Bear in mind im a rookie in coding and Dreamweaver.
    Hope the code below helps...
    Thanks!

    Thanks for responing!
    Removing display: inline-table; worked!
    Its now center aligned.
    Cheers osgood_

  • Problem with align and Selection Tool.

    This is a weird problem which I cannot explain at all.
    I am using AI CS3 with Windows XP.
    I am having this completely random problem with the selection tool and align pallette I cannot explain.
    I have a group of objects and groups of objects I am trying to use the align pallette on.
    Sometimes when I select all of the items I want to align, either by shift-clicking each one, or by drag-selecting them I am getting a random behavior where sometimes the align button will move all of the objects COMPLETELY off of the artboard, all the way to the edge of the working area and beyond into the grey area you cannot see.
    Normally, this would be caused by a stray point somewhere way off-screen or some other cleanup oriented thing on my part. However in this case, the behavior is random and does not happen every time I hit the align button.
    Sometimes it takes items within my grouped objects (lines of text) and moves THEM completely off the work area, leaving the other items in the groups in place. Sometimes the bounding box when I drag-select the items will stretch extremely far off of the work area.
    I have even dragged the extra large bounding box, bringing the edge that was once way off screen onto the work area, in outline view, in hopes of finding the stray point or object that could be causing this. However NOTHING appears that can be causing the align to throw all of my objects off-screen.
    The random nature of this behavior and the way it sometimes affects my text objects inside of groups leads me to believe it is a program bug and nothing I am doing.
    The behavior takes place regardless if I select by dragging or by shift-clicking, and is happening in more than one file, also randomly.
    Also, choosing "align to art board" vs. "align to crop area" does nothing to change this behavior.
    It is quite irritating. I've been using illustrator since v.88 so I have enough experience to know this is not normal.
    Any help with this one would be greatly appreciated.

    When this behaviour occurs, are perhaps guides included in your selection?

  • Need help with Template - unbalanced #EndEditable tag

    I am unable to use this template to create a new page and get the "unbalanced #EndEditable tag" error.
    If I open the file independently it looks great - otherwise I get the error.
    Code for internal_students.dwt
    There is an error at line 45, column 79 (absolute position 2188)
    <div id="metanav"><!-- #BeginLibraryItem "/Library/metaNav.lbi" -->
    <p><a href="../Library/contact/index.html">Contact Us</a></p>
    <!-- #EndLibraryItem --></div>
            <div id="navigation">
                <div id="navigation_l">
                    <div id="navigation_r"><!-- #BeginLibraryItem "/Library/mainNav.lbi" --> <ul>
                            <li><a href="../index.html" class="first"><img src="../images/spacer.gif" alt="CAITE Homepage" width="75" height="20" border="0" /></a></li>
                            <li><a href="../about/index.html">About</a></li>
      <li><a href="../news/index.html">News And Events</a></li>
      <li><a href="../educators/index.html">For Educators</a></li>
      <li><a href="../students/index.html">For Students</a></li>
      <li><a href="../industry/index.html" class="last">For Industry</a></li>
                        </ul>
    <!-- #EndLibraryItem --></div>
    I need help with this as the site and templates were created 2/3 years before I arrived on the job.
    Thank you
    Cheryl

    Okay
    - This is on-line page  http://caite.cs.umass.edu/students/index.html
    If you want code from template here it is:
    <!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"><!-- InstanceBegin template="/Templates/internal_about.dwt" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>CAITE - Commonwealth Alliance for Information Technology Education</title>
    <!-- InstanceEndEditable -->
    <!-- InstanceBeginEditable name="head" -->
    <meta name="Description" content="Commonwealth Alliance for Information Technology Education (CAITE) to design and carry out comprehensive programs that address under representation in information technology (IT) education and the workforce. CAITE will focus on women and minorities in groups that are underrepresented in the Massachusetts innovation economy" />
    <meta name="Keywords" content="Commonwealth Alliance for Information Technology Education CAITE Massachusetts women minorities information technology IT" />
    <meta name="robots" content="all, index, follow" />
    <meta name="revisit-after" content="14 days" />
    <meta name="author" content="Outreach Web Team" />
    <!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable --><!-- InstanceEndEditable -->
    <link rel="shortcut icon" href="/images/favicon.ico" />
    <script type="text/javascript" src="../scripts/jquery.js"></script>
    <script type="text/javascript" src="../scripts/jquery.easing.js"></script>
    <script type="text/javascript" src="../scripts/jquery.pngfix.js"></script>
    <script language="JavaScript" type="text/JavaScript">
        <!--
        $(document).ready(function() {
            $("img[@src$=png], div#wrapper_l, div#wrapper_r, div#whatsnew").pngfix();
        //-->
    </script>
    <link href="../css/screenstyle.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="../css/printstyle.css" rel="stylesheet" type="text/css" media="print" />
    </head>
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <body>  
        <div id="wrapper">
            <div id="metanav"><!-- #BeginLibraryItem "/Library/metaNav.lbi" -->
    <p><a href="../Library/contact/index.html">Contact Us</a></p>
    <!-- #EndLibraryItem --></div>
            <div id="navigation">
                <div id="navigation_l">
                    <div id="navigation_r"><!-- #BeginLibraryItem "/Library/mainNav.lbi" --> <ul>
                            <li><a href="../index.html" class="first"><img src="../images/spacer.gif" alt="CAITE Homepage" width="75" height="20" border="0" /></a></li>
                            <li><a href="../about/index.html">About</a></li>
      <li><a href="../news/index.html">News And Events</a></li>
      <li><a href="../educators/index.html">For Educators</a></li>
      <li><a href="../students/index.html">For Students</a></li>
      <li><a href="../industry/index.html" class="last">For Industry</a></li>
                        </ul>
    <!-- #EndLibraryItem --></div>
                    <!-- end navigation right -->
                </div><!-- end navigation left -->
           </div><!-- end navigation -->
            <div id="wrapper_l">
                <div id="wrapper_r">
                      <div id="innerwrapper">
                        <div id="internalBanner-print"> <h1>Commonwealth Alliance for Information Technology Education (CAITE)</h1></div>
                        <div id="internalBanner"><!-- InstanceBeginEditable name="internalBanner" -->
                          <div class="students-banner">
                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                              <tr>
                                <td width="125" height="188" align="left" valign="top" id="homeImage"><img src="../images/logo_vertical_small.png" alt="CAITE" width="105" height="188" /></td>
                                <td align="left" valign="top" id="internal-banner-quote"><div id="internalQuote">
                                    <div id="internalQuote-inner">
                                      <p>CAITE designs and carrys out comprehensive programs that address under-representation in information technology (IT).</p>
                                  </div>
                                </div></td>
                              </tr>
                            </table>
                        </div>
                        <!-- InstanceEndEditable --></div> <!-- end banner -->
                        <div id="internalContent">
                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                              <tr>
                                <td width="317" align="left" valign="top" id="secondary-content">
                                  <!-- InstanceBeginEditable name="SecondaryNav" --><!-- #BeginLibraryItem "/Library/studentNav.lbi" -->
                                  <h3><a href="../students/index.html">For Students</a></h3>
                                  <div id="secondaryNav">
                                    <ul>
                                      <li><a href="http://www.takeITgoanywhere.org" target="_blank">TakeITgoanywhere.org</a></li>
                                    </ul>
    </div><!-- #EndLibraryItem --><!-- InstanceEndEditable -->
                                </td>
                                <td align="left" valign="top" id="contentCell"><!-- InstanceBeginEditable name="mainContent" -->
                                  <h1>For Students</h1>
                                  <p>The University of Massachusetts Amherst is leading a Commonwealth Alliance for Information Technology Education (CAITE) to design and carry out comprehensive programs that address under representation in information technology (IT) education and the workforce. CAITE will focus on women and minorities in groups that are underrepresented in the Massachusetts innovation economy; that is, economically, academically, and socially disadvantaged residents.</p>
                                  <p>The project will pilot a series of outreach programs supported by educational pathways in three regions (one rural, one suburban, and one urban). The project will include work with high school teachers, staff, and counselors. CAITE will identify best practices and disseminate, deploy, extend and institutionalize these best practices statewide and nationally.</p>
                                  <p>Community colleges are the centerpiece of CAITE because of the central role they play in reaching out to underserved populations and in serving as a gateway to careers and further higher education.</p>
                                  <p>This project will build a broad alliance built on its leadership in and partnership with the Commonwealth Information Technology Initiative (CITI), the Boston Area Advanced Technological Education Center (BATEC), regional Louis Stokes Alliances and NSF EGEP programs, and other partnerships and initiatives focused on information technology education and STEM pipeline issues</p>
                                  <p> </p>
                                <!-- InstanceEndEditable --></td>
                              </tr>
                          </table>
                        </div>
                        <div id="alliances">
                              <table width="100%" border="0" cellpadding="0" cellspacing="0">
                                <tr>
                                  <td height="30"  align="left" valign="top"><h2><a href="../about/alliances.html">Alliances</a></h2></td>
                                </tr>
                                <tr>
                                  <td  align="center" valign="middle"><!-- #BeginLibraryItem "/Library/AllianceTable.lbi" --><p>
    <table border="0" cellpadding="2" cellspacing="0">
                                    <tr>
                                      <td width="35"  align="center" valign="middle"> </td>
                                      <td  align="center" valign="middle"><a href="http://www.citi.mass.edu/" target="_blank"><img src="../images/logo_citi.jpg" alt="Citi" width="65" height="50"  border="0 /"></a></td>
                                      <td align="center" valign="middle"><a href="http://www.batec.org/index.php" target="_blank"><img src="../images/logo_batec.jpg" alt="BATEC" width="69" height="46" border="0" /></a></td>
                                      <td  align="center" valign="middle"><a href="http://www.nsf.gov/index.jsp" target="_blank"><img src="../images/nsflogo.gif" alt="NSF" width="64" height="65" border="0" ></a></td>
                                      <td  align="center" valign="middle"><a href="http://www.nelsamp.neu.edu/" target="_blank"><img src="../images/nelsamplogo.gif" width="100" border="0"></a></td>
                                      <td  align="center" valign="middle"><p><a href="http://mysite.verizon.net/milnerm/" target="_blank"><img src="../images/umlsamp.png" width="85" height="63" border="0"></a></p>                                  </td>
                                      <td  align="center" valign="middle"><a href="http://www.neagep.org/index.asp" target="_blank"><img src="../images/nealogo.gif" border="0" ></a></td>
      </tr>
                                  </table>
    <!-- #EndLibraryItem --></td>
                                </tr>
                          </table>
                        </div>
                    </div> <!-- end inner wrapper -->
                </div><!-- end wrapper right -->
            </div><!-- end wrapper left -->
            <div id="bottom">
                <div id="bottom_l">
                    <div id="bottom_r"> </div><!-- end bottom right -->
                </div><!-- end bottom left -->
            </div>  <!-- end bottom -->
        </div><!-- end wrapper -->
        <div id="copyright"><!-- #BeginLibraryItem "/Library/copyright.lbi" -->
    <p>Sponsored by CAITE an NSF CISE Broadening Participation in Computing Alliance<br />
    &copy; copyright 2008 <a href="http://www.umass.edu/" target="_blank">University of Massachusetts, Amherst</a></p>
    <font color="#666666"><br>
    </font>
    <p><font color="#666666" size=2>  This material is based upon work supported by the National Science Foundation under Grant No.s NSF-0634412 and NSF-0837739. Any opinions, findings, and conclusions or recommendations expressed in this material are those of the author(s) and do not necessarily reflect the views of the National Science Foundation.</font> </p>
    <!-- #EndLibraryItem --></div>    
    <!-- end copyright -->
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    try {
    var pageTracker = _gat._getTracker("UA-7435501-1");
    pageTracker._trackPageview();
    } catch(err) {}</script>
        </body>
    <!-- InstanceEnd --></html>

  • Need help with overlapping divs!

    Hey everyone,
    I'm working on another website and I have come up against a common problem for newbie designers from what I hear, the dreaded overlapping div problem!  I have a 2 column fixed layout with a floating left div.  My left div has my nav bar and various images.  When my main content div has more content than the left floating div, the left div border does not reach the footer!  Until now, I have gotten by with just hitting return in my left column div until it reaches the footer.  I am sure it is not the right way to do it but it has worked so far.  The problem is, now one of the pages has the left column div overlapping onto the footer!  I did some reading and I am guessing it involves either the box properties or clear float which I am not too familiar with.
    Any advice would be stellar!  I know this is just another stumbling block to get over but I would feel so much better if I was doing it the right way. 
    Here are screens of my issue,
    And here is my code for the page in question.
    <!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" />
    <link rel="shortcut icon" href="http://www.xldesignsonline.com/fchi/favicon.ico">
    <title>Full Circle Home Inspections</title>
    <link href="_css/main.css" rel="stylesheet" type="text/css" /><!--[if IE 5]>
    <style type="text/css">
    /* place css box model fixes for IE 5* in this conditional comment */
    .twoColFixLtHdr #sidebar1 { width: 230px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColFixLtHdr #sidebar1 { padding-top: 30px; }
    .twoColFixLtHdr #mainContent { zoom: 1; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <style type="text/css">
    <!--
    body {
         background-color: #FFF;
    .paragraphLead {
         font-size: 110%;
         font-weight: bold;
    a:link {
         text-decoration: none;
         color: #CF0;
    a:visited {
         text-decoration: none;
    a:hover {
         text-decoration: none;
    a:active {
         text-decoration: none;
    #apDiv1 {
         position:absolute;
         width:236px;
         height:157px;
         z-index:1;
         left: 692px;
         top: 372px;
    #apDiv2 {
         position:absolute;
         width:200px;
         height:192px;
         z-index:2;
         left: 697px;
         top: 1443px;
    #apDiv3 {
         position:absolute;
         width:158px;
         height:204px;
         z-index:2;
         left: 643px;
         top: 1502px;
    -->
    </style>
    <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
    </head>
    <body class="twoColFixLtHdr">
    <div id="container">
      <div id="header">
        <h1><!-- end #header -->
      </h1></div>
      <div id="sidebar1">
        <h3 align="center">
          <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="200" height="620">
            <param name="movie" value="_assets/menu.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" />
            <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="_assets/menu.swf" width="200" height="620">
              <!--<![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" />
              <!-- 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>
        </h3>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.nachi.org/"><img src="_images/interNACHI.png" alt="InterNACHI" width="190" height="164" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.nachi.org/education.htm"><img src="_images/education-seal-small.gif" alt="education seal" width="150" height="150" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.iac2.org/"><img src="_images/iac2-all.gif" width="174" height="126" alt="IAC" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.inspectopia.com/profile.b.507.r.16181.u.03bcfb.html"><img src="_images/logo_top.png" alt="Inspectopedia" width="190" height="45" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.energystar.gov/"><img src="_images/img_energy_star_partner.jpg" width="160" height="191" alt="Energy Star Partner" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://cjenterprises.myshaklee.com/us/en/welcome.html#"><img src="_images/Shaklee.gif" alt="Shaklee" width="119" height="160" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://activerain.com/"><img src="_images/ARLogoSmall.gif" alt="Active Rain" width="135" height="36" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.insiderpages.com/b/15246780294"><img src="_images/insider_pages.gif" alt="Insider Pages" width="89" height="37" border="0" /></a></p>
    <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
      </div>
      <div id="mainContent">
        <h2>Radon Gas Inspection</h2>
        <div id="paragraphFloat">
          <h5>What Is Radon?</h5>
          <p> Radon is a cancer causing radioactive gas. You cannot see, smell or taste radon, but it may be a problem in your home. The Surgeon General has warned that radon is the second leading cause of lung cancer in the United States today. </p>
          <div id="apDiv1">
        <div align="center"><a href="http://www.epa.gov/radon/video/epa-epu.wmv"><img src="_images/psa_revised.jpg" alt="What Is Radon?" width="200" height="172" border="0" /></a></div></div></div>
        <p>If you smoke and your home has high radon levels, you're at high risk for developing lung cancer. Some scientific studies of radon exposure indicate that children may be more sensitive to radon. This may be due to their higher respiration rate and their rapidly dividing cells, which may be more vulnerable to radiation damage. </p>
    <p> </p>
        <h5>Why Is It Dangerous?</h5>
    <p> The U.S. Environmental Protection Agency (US EPA) and the Surgeon General's Office have estimated that as many as 20,000 lung cancer deaths are caused each year by radon. Radon is the second leading cause of lung cancer. Radon-induced lung cancer costs the United States over $2 billion dollars per year in both direct and indirect health care costs.</p>
    <p>According to the US EPA, nearly 1 in 3 homes checked in seven states and on three Indian lands had screening levels over 4 pCi/L, the EPA's recommended action level for radon exposure.</p>
    <p>The alpha radiation emitted by radon is the same alpha radiation emitted by other alpha generating radiation sources such as plutonium.</p>
    <p>A family whose home has radon levels of 4 pCi/l is exposed to approximately 35 times as much radiation as the Nuclear Regulatory Commission would allow if that family was standing next to the fence of a radioactive waste site. (25 mrem limit, 800 mrem exposure)</p>
    <p> At the 4 pCi/l EPA action guideline level, radon carries approximately 1000 times the risk of death as any other EPA carcinogen. It is important to note that the action level is not a safe level, as there are no &quot;safe&quot; levels of radon gas.</p>
    <p> </p>
    <h5>How Does It Get Into My Home?</h5>
    <p> Radon is a radioactive gas. It comes from the natural decay of uranium that is found in nearly all soils. It typically moves up through the ground to the air above and into your home through cracks and other holes in the foundation. Your home traps radon inside, where it can build up. Any home may have a radon problem. This means new and old homes, well-sealed and drafty homes, and homes with or without basements.</p>
    <p> Radon from soil gas is the main cause of radon problems. Sometimes radon enters the home through well water. In a small number of homes, the building materials can give off radon, too. However, building materials rarely cause radon problems by themselves.</p>
    <p><strong>Radon gets in through:</strong></p>
    <ul>
      <li>Cracks in solid floors
        <div id="apDiv3">
          <div align="center"><a href="http://www.fullcirclehomeinspections.com/_assets/CitizensGuideRadon.pdf"><img src="_images/citguidecoverradon.jpg" alt="Guide To Radon" width="154" height="200" border="0" /></a></div>
        </div>
      </li>
      <li>Construction joints</li>
      <li>Cracks in walls</li>
      <li>Gaps in suspended floors</li>
      <li>Gaps around service pipes</li>
      <li>Cavities inside walls</li>
      <li>Surrounding water supply</li>
    </ul>
    <p> </p>
    <h5>What Can I Do?</h5>
    <p> Radon is a national environmental health problem. Elevated radon levels have been discovered in every state. The US EPA estimates that as many as 8 million homes throughout the country have elevated levels of radon. Current state surveys show that 1 home in 5 has elevated radon levels.</p>
    <p> Testing is the only way to know your home's radon levels. There are no immediate symptoms that will alert you to the presence of radon. It typically takes years of exposure before any problems surface. </p>
    <p>Let <strong>Full Circle Home Inspections</strong> ensure your family and your home are protected and safe from radon exposure!</p>
    <p> </p>
    <h5>Radon Myths</h5>
    <p><strong><em>MYTH:</em> Scientists are not sure that radon really is a problem.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Although some scientists dispute the precise number of deaths due to radon, all the major health organizations (like the Centers for Disease Control and Prevention, the American Lung Association and the American Medical Association) agree with estimates that radon causes thousands of preventable lung cancer deaths every year. This is especially true among smokers, since the risk to smokers is much greater than to non-smokers.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon testing is difficult, time-consuming and expensive.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Radon testing is easy. You can test your home yourself or hire a qualified radon test company. Either approach takes only a small amount of time and effort.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Homes with radon problems can't be fixed.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> There are simple solutions to radon problems in homes. Hundreds of thousands of homeowners have already fixed radon problems in their homes. Most homes can be fixed for about the same cost as other common home repairs; check with one or more qualified mitigators. Call your <a href="http://www.epa.gov/radon/whereyoulive.html">state radon office</a> for help in identifying qualified mitigation contractors.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon affects only certain kinds of homes.</strong></p>
    <blockquote>
      <p><strong><em>FACT: </em></strong>House construction can affect radon levels. However, radon can be a problem in homes of all types: old homes, new homes, drafty homes, insulated homes, homes with basements, and homes without basements. Local geology, construction materials, and how the home was built are among the factors that can affect radon levels in homes.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon is only a problem in certain parts of the country.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> High radon levels have been found in every state. Radon problems do vary from area to area, but the only way to know your radon level is to test.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> A neighbor's test result is a good indication of whether your home has a problem.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> It's not. Radon levels can vary greatly from home to home. The only way to know if your home has a radon problem is to test it.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Everyone should test their water for radon.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Although radon gets into some homes through water, it is important to first test the air in the home for radon. If your water comes from a public water supply that uses ground water, call your water supplier. If high radon levels are found and the home has a private well, call the Safe Drinking Water Hotline at 1-800-426-4791 for information on testing your water.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> It's difficult to sell homes where radon problems have been discovered.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Where radon problems have been fixed, home sales have not been blocked or frustrated. The added protection is some times a good selling point.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> I've lived in my home for so long, it doesn't make sense to take action now.</strong></p>
    <blockquote>
      <p><strong><em>FACT: </em></strong>You will reduce your risk of lung cancer when you reduce radon levels, even if you've lived with a radon problem for a long time.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Short-term tests can't be used for making a decision about whether to fix your home.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em> </strong>A short-term test, followed by a second short-term test* can be used to decide whether to fix your home. However, the closer the average of your two short-term tests is to 4 pCi/L, the less certain you can be about whether your year-round average is above or below that level. Keep in mind that radon levels below 4 pCi/L still pose some risk. Radon levels can be reduced in most homes to 2 pCi/L or below.</p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p align="center"><img src="_images/CA-3.jpg" width="520" height="207" /></p>
    </blockquote>
      </div>
      <div id="footer">
        <p align="center"><strong>© 2009 XL Designs Online - All Rights Reserved </strong></p>
      </div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    swfobject.registerObject("FlashID");
    //-->
    </script>
    </body>
    </html>
    And here is my CSS if needed,
    @charset "utf-8";
    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;
    .twoColFixLtHdr #container {
         width: 950px; /* 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. */
         margin-top: 20px;
         margin-right: auto;
         margin-bottom: 20px;
         margin-left: auto;
         background-color: #557050;
    .twoColFixLtHdr #header {
         border-bottom: 1px solid #000000;
         height: 250px;
         background-color: #DDDDDD;
         padding-top: 0;
         padding-right: 10px;
         padding-bottom: 0;
         padding-left: 20px;
         background-image: url(../_images/homebanner1.png);
    .twoColFixLtHdr #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: 20px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
         text-align: center;
         font-size: 48px;
         font-family: Tahoma, Geneva, sans-serif;
         color: #000;
    .twoColFixLtHdr #sidebar1 {
         float: left; /* since this element is floated, a width must be given */
         width: 200px;
         border-right: 1px solid #000000;
         background-color: #557050;
         padding-top: 0px;
         padding-right: 10px;
         padding-bottom: 15px;
         padding-left: 10px;
    .twoColFixLtHdr #mainContent {
         margin-top: 0;
         margin-right: 0;
         margin-bottom: 0;
         margin-left: 250px;
         padding-top: 0;
         padding-right: 20px;
         padding-bottom: 0;
         padding-left: 20px;
         text-align: left;
    .twoColFixLtHdr #mainContent h1 {
         font-size: 48px;
         font-family: "Arial Rounded MT Bold";
         font-weight: bold;
    .twoColFixLtHdr #mainContent h2 {
         font-family: "Arial Rounded MT Bold";
         font-size: 32px;
    .twoColFixLtHdr #mainContent h3 {
         font-family: Georgia, "Times New Roman", Times, serif;
         font-style: italic;
         color: #CF0;
         font-size: 125%;
    .twoColFixLtHdr #mainContent h5 {
         font-size: 120%;
    .twoColFixLtHdr #footer {
         padding: 20px 10px 20px 20px;
         border-top: 1px solid #000000;
         background-color: #A3A3A3;
         font-family: Arial, Helvetica, sans-serif;
    .twoColFixLtHdr #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: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    .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;
    #paragraphFloat {
         width: 350px;
    #paragraphFloat2 {
         width: 350px;
    Please if anyone knows what I'm doing wrong please please let me know!  Since I am learning, I really want to get main concepts like this down so I am not constantly doing things the hard way!  Thank you! 
    Jayson

    1) Regarding validation, what does it do?
    It validates by telling you where your code isn't er... valid.  Sometimes the results are a bit jumbled but if you work through them one at a time and revalidate, it's a good way to learn.  If you fix all of the errors shown up through the validator you should end up with standards compliant code.  Not necessarily the best, most efficient code you can write but at least it will be valid and it helps you spot errors that hours of code-staring never seems to find.
    I don't use the DW validation tool because I find the W3c one easier.
    The W3c validator has a check box of HTML Tidy which can tidy up your code but it's not always as easy to see what changes.
    2) I know the <p> tag for spacing is wrong, I could just feel it in my bones.  I just didn't know what else to do.  If I <br> all the way down won't the code be just as cluttered?
    You're obviously a born web coder!
    <br> will bloat your page if you use them to position elements.
    Here you need to get used to a) the Block Model and b) CSS positioning.  Once you crack these, CSS opens up for you and becomes a little more intuitive.
    if you have two elements on top of each other rather than push them apart with other elements you do it with padding and/or margin.  There are things to watch out for here namely, collapsing margins but if you start to read up on the above, you'll get it.
    I just thought of something.  If I add a div in main content, align it to the bottom center with CSS, use a line break between it and the text above, and add the image in question in the new div, will the spacing between the text and image work itself out?  I just really want to get out of the <p> bad habit.
    Keep thinking!  Web design is not like desktop publishing or print.  Elements on a HTML page don't behave like paragraphs on a page.  Once you begin to figure out why not it all gets a little easier.
    If you want an image at the bottom an element you put that at the end of the content in that element.  Then you need to ensure there is no margin, padding or border between the img element and the next element (your footer).  HTML elements come with some styling that is applied by default in the browser.  Many web developers include a rule like this:
    body {
    margin: 0;
    padding:0;
    This sets the margin and padding to zero of course and it's purpose is to override the defaults.  Some people advocate applying similar rules to all elements and if your interested try googling Eric Meyer who has written about it online.
    One of the key purposes of CSS is to take styling out of the page.  It's leaner, more efficient for the viewer and the coder and helps with site management.
    3) AP divs are weird, and I did only use as a last resort.
    See? You're a natural!
    The reason is I am confused by the float and clear float classes.  My left column is floated left and that element is what I was having problems understanding.  I tried to make new divs and float right but I screwed it all up.  I am sure I am just not applying the clear float in the right places.
    Getting the hang of floating is key to CSS positioning.  You use a float if you want two elements to sit side by side on the page.  It disrupts the "document flow."  Ordinarily HTML elements are rendered one after the other, on top of each other.  Floating an element takes it out of the document flow and allows other elements to occupy its space.  When you float an element it should always have a width.  If the element below it also has a width, that width has to be sufficiently narrow to allow it to occupy the space.  In short, floated elements can't be wider than their containing element.
    The clear property is used after a float to stop an element occupying the space left by a floated element.  It works but confuses the heck out of me!
    So that leads me to my final point.  I am a novice too!  I might have fluffed a few of the technical points above but it's pretty much there.
    Regards
    Martin

  • Need help with XML transformation

    I am not sure this is the right place for this. But i will try it here. I am very troubled with my XSLT. Trying to transform a text Coupon which has the following html for it. So,
    _1. INPUT is:_
    <html>
    <head>
    </head>
    <body>
    <p>
    This coupon is for a good guy whose first name is :
    </p>
    <p>
    </p>
    <p align="center">
    Sadd
    </p>
    <p align="center">
    </p>
    <p align="right">
    <b>also</b> whose <var>full_name</var> is Sadd Hossain
    </p>
    <p align="left">
    </p>
    <p align="left">
    He is a <font size="3">software </font><font size="4">engineer for</font><font size="5">
    S&H</font>
    </p>
    </body>
    </html>
    *2. output needed  is:*
    <?xml version="1.0" encoding="UTF-8"?>
    <POSMESSAGE>
    <TextMSG >
    This coupon is for a good guy whose first name is :
    </TextMSG>
    <TextMSG >
    </TextMSG>
    <TextMSG align="center">
    <emph>SADD</emph>
    </TextMSG>
    <TextMSG >
    </TextMSG>
    <TextMSG align="right" >
    also whose full_name is Sadd Hossain
    </TextMSG>
    <TextMSG>
    </TextMSG>
    <TextMSG align="left" >
    He is a software engineer
    for S&H
    </TextMSG>
    </POSMESSAGE>
    *3. XSLT for this*
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="xml"/>
    <xsl:template match="body">
    <POSMESSAGE>
    <xsl:for-each select="p">
    <TextMSG>
    <!--xsl:if test="not[@align='']"-->
    <xsl:attribute name="align"><xsl:value-of select="@align"/></xsl:attribute>
    <!--/xsl:if-->
    <xsl:attribute name="font"><xsl:value-of select="@size"/></xsl:attribute>
    <xsl:value-of select="."/>
    </TextMSG>
    <xsl:for-each select="b">
    <emph>
    <xsl:value-of select="."/>
    </emph>
    </xsl:for-each>
    </xsl:for-each>
    </POSMESSAGE>
    </xsl:template>
    </xsl:stylesheet>
    *4: the above xslt generating this output*
    <?xml version="1.0" encoding="UTF-8"?>
    <POSMESSAGE><TextMSG align="" font="">
    This coupon is for a good guy whose first name is :
    </TextMSG><TextMSG align="" font="">
    </TextMSG><TextMSG align="center" font="">
    SADD
    </TextMSG><TextMSG align="center" font="">
    </TextMSG><TextMSG align="right" font="">
    also whose full_name is Sadd Hossain
    </TextMSG><TextMSG align="left" font="">
    </TextMSG><TextMSG align="left" font="">
    He is a software engineer
    for S&H
    </
    *5: Need help with this. what should my xslt look like to get the desired output???????????????*
    any help or direction will be very much appreciated. Thank you_

    I have below suggestions:
    1. Please use code option given in message editor toolbar for posting any formatted content like XML, Java code snippet etc.
    2. replace & in your source XML with _& a m p ;_ (Without spaces, I have put spaces to make it visible here).
    3. I have modified your XSLT according output XML you have given. I am not sure what you want to do with some elements like <b>, <font>, <var> etc. change below XSLT as you require for these elements.
    Modified XSLT:
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
            <xsl:output method="xml"/>
         <xsl:template match="body">
              <POSMESSAGE>
                   <xsl:for-each select="p">
                        <TextMSG>
                             <xsl:if test=". != ''">
                                  <xsl:for-each select="@align">
                                       <xsl:attribute name="align">
                                            <xsl:value-of select="."></xsl:value-of>
                                       </xsl:attribute>
                                  </xsl:for-each>
                                  <xsl:value-of select="."/>
                             </xsl:if>
                        </TextMSG>
                   </xsl:for-each>
              </POSMESSAGE>
         </xsl:template>
    </xsl:stylesheet>
    OUTPUT:
    <?xml version="1.0"?>
    <POSMESSAGE>
         <TextMSG>This coupon is for a good guy whose first name is :</TextMSG>
         <TextMSG/>
         <TextMSG align="center">Sadd</TextMSG>
         <TextMSG/>
         <TextMSG align="right">alsowhose full_name is Sadd Hossain</TextMSG>
         <TextMSG/>
         <TextMSG align="left">He is a softwareengineer forS&H</TextMSG>
    </POSMESSAGE>

  • Need Help with Photomerge Group Shot

    I'm trying to photomerge a group shot and having trouble with it.  The person I'm trying to cut out of the source photo gets plopped into the middle of the final photo and I can't line her up with in final shot.  Is there a way I can relocate the section that gets pasted into the final photo?   I'm also have trouble with aligning the photo--how do you know what points to select in the fist and second photo?  I've been playing with it, but the photos get terribly distorted.
    Appreciate any help.  I was expecting Photoshop Elements 10 to make this easy, and so far, it hasn't impressed me.
    Thanks,
       Terri

    OK, here we go:
    Make a selection (in the main image) of the area you want to be replaced:
    Open your other image, select the head to use, and copy it to the Clipboard.  (I simply used another one of the heads in this photo.)
    Back in the main image, use Edit...Paste into Selection:
    Change to the Move Tool and move the pasted-in image to where it looks best:
    You already know what to do next with the Clone Tool.   (Probably have to use Layer...Flatten Image to get rid of all the selections and layers so the Clone Tool can do its work....)
    Ken
    P.S.,  Looks like you did a real good job with the girl on the left.
    P.P.S.,  The image is a bit too small for us to do precision work (but it's OK for this example).  Next time you can try something about 2 or 3 times larger and see if the forum software accepts it.

Maybe you are looking for

  • Automatic Outgoin Payments - Bank Transfers

    Hello, I created an Automatic payment and executed the payment media using program  RFFOEDI1 . The job log gave the following message : No variants found for format ACH No Payment Media Created in Format 100 Step 002 started (program RFFOEDI1, vari P

  • Spam/Junk mail button

    So where exactly are the "Spam" or "Junk Mail" buttons in iPhone OS

  • How to delete a tvshow on apple tv

    I need to delete a tv show i bought and I dont want it anymore, how can I delete it?

  • Mountain Lion Dual screen window Full screen problem?

    I could not upgrade from Snow Leopard to Lion on my iMac because dual screen operation was broken when a window on one screen was set to full screen. Has this been fixed in Mountain Lion?

  • SunFire 480R - Solaris 10 New Install

    Immediatly after the probing of all the NIC cards I get: message overflow on /dev/log minor #6 -- is syslogd(1M) running? message overflow on /dev/log minor #6 -- is syslogd(1M) running? message overflow on /dev/log minor #6 -- is syslogd(1M) running