Transition positioning

When adding (or editing??) a transition on either the video or audio tracks is it possible to have it positioned at a user defined point rather than start at cut, end at cut or centred at a cut?
For instance, how can I place a 75 frame transition on a cut between two shots and have it start 25 frames before the cut.
Brian

There are a few ways to do this. But there are some things to understand about how FCP does transitions, too.
Part of your issue is, that by doing this, you are creating - in FCP's eyes - an Asymmetric Edit point. So, if you're not doing both video and audio, make sure that Linked Selection is toggled off - use Shift-L, the Button Bar, or the Edit menu
Make sure you're zoomed into your timeline fairly well
Apply your transition(s)
Adjust your transition(s) to Start on Edit (select it and press Option-1 is one way to do that)
Drag the right edge(s) out until your duration is correct
Now, when you place your mouse cursor over the left edge(s) of the transition(s), it'll become the Roll tool. Dragging the left edge 25 frames (further to the left) should achieve your desired results
Having said all that, what FCP is actually doing here is adjusting your video (and/or audio) cut point to be 25 frames earlier. Delete the transition(s) and you'll see this.
Or is this not what you're going for?

Similar Messages

  • Best way to create slide shows in PE4 and PSE 6

    What's the best way to create a fancy slide show in PE 4 and PSE 6? I need to create a slide show of about 600 pictures. I'm on Windows XP with 3gb RAM. I've done this a few years ago in earlier versions of PE and PSE. Before i plunge into this again i wanted to get some overall guidance for what to do or not do.
    My ultimate goal is to create a slide show that:
    1. uses pan and zoom on every photo
    2. transitions between every photo
    3. has an audio track
    4. has some nice special effects -- words and graphics that appear on slide at precisely the right moment to match the song, and stay on the screen as one slide transitions to another. i want the text to be able to move and fade in and out.
    My view is that it's easy to accomplish #1-3 in PSE 6; it's quite simple to create a slide show, add pan and zoom, and transitions. However, #4 is not doable because adding text and graphics can only be done on a slide at a time and only when the slide start/stops (i.e., you can't have text appear 2 secs after the slide has started displaying and stay on screen while the next slide appears). Need PE 4 to do that.
    What i'm wondering is:
    -- is it best to create the basic slide show in PSE6 and then export to PE 4 to do the final fancy stuff, or is it best to just create the show in PE4? Seems that doing the pans, zooms, and transitions are easiest in PSE 6.

    eric,
    I am going to offer some reasons NOT to start this slide show in Photoshop Elements. This is despite the fact that I have used the workflow of starting in Photoshop Elements and used the Send Slideshow to Premiere Elements in PSE5 - PE 3 and PSE7 - PE7.
    1- Timing differences between the PSE and PE slide show construction and processing
    There are many differences in timing between the two products. Transitions can start/end slightly offset from their timing in PSE once they arrive and are processed in PE. Same for pan and zoom. Does this matter? Well the more precise your timing, the more potential for a show stopper.
    Example: one person who wanted continual motion using pan and zoom needed to go modify the transition positioning and the keyframing of the pan/zooms on every single slide after sending a slideshow from PSE to PRE.
    2- your requirement to
    "words and graphics that appear on slide at precisely the right moment to match the song, and stay on the screen as one slide transitions to another. i want the text to be able to move and fade in and out."
    You can't really sync the audio to a slide in PSE. The text can't move or fade in/out. I think that it will be more grief to retrofit these functions to a slide show that was created in PSE than it will be to do the all the work in Premiere Elements.
    3- "Add the sound track for the ENTIRE slide show (this will be longer than i currently have slides for because i don't have all the photos"
    I am suspicious that adding the ENTIRE sound track in one PSE slide show will not work.
    I have done multiple sends from PSE slide show editor to Premiere Elements. However, I decided on the approach of using no audio in the PSE slideshow editor and adding Audio in Premiere Elements AFTER sending all the slide shows.
    Again, your objective of syncing specific photos to music points is good artistically - but I am concerned that it will make your PSE to PRE workflow problematic.
    4- "as new photos arrive, do the arrangement/pans/zooms in PSE and move them to PE"
    As Steve mentioned when you do subsequent sends of the slideshow, it appends to the end - does not seem to fit your objective of replacing part of the middle.
    Also if you get new photos in for the second section of the slideshow - but over in Premiere Elements you had already made other changes in the second section. There is no function to combine new changes doen in PSE and changes done in PE for that same "section" of the slideshow.
    5- you did not say whether you will be outputting this slide show in Full Screen or Widescreen format. Will you be burning a DVD? If you will be doing widescreen output, additional problems with specifying pan/zoom in PSE have been identified on various forums because the PSE pan/zoom boxes are not widescreen aspect ratio.
    Conclusion:
    Some of my comments here are definitely subjective - however, it is my overall conclusion that your objectives and work plan are not a good fit for the Photoshop Elements slide show editor to Premiere Elements workflow.
    My perspective on the Photoshop Elements slide show editor is that it is designed to simple, quick and easy. Therefore it has limitations.

  • Reverse Stock In Transit

    Hello all,
    Case is
    In PO qty = 5.008 KG
    Delivery = 5.00 KG
    PGI = 5.00 KG
    When doing GR in receiving plant: Error for Qty Exceeded by xxx KG
    In MB5T qty = 5.008 KG
    Now i want to reverse the PGI
    When I reverse the PGI [641 Mvt] thru VL09, i get error message
    Deificit of PL Stock in Transit 0.013 KG ....
    How I can transfer deficit qty 0.013 in Stock in transit so that i can reverse the PGI?
    Thanks

    Hello ,
    Jurgen explained is correct, But if want to reverse the stock in Transit material
    Case is
    In PO qty = 5.008 KG
    Delivery = 5.00 KG
    PGI = 5.00 KG
    When doing GR in receiving plant: Error for Qty Exceeded by xxx KG
    In MB5T qty = 5.008 KG
    Now i want to reverse the PGI.
    If you have issue the material from supplying plant means then stock is showing in stock in transit. System will not allow you reverse the stock in transite by normal movment type.
    Std SAP has given reverse the "stock in transite" material from Stock in transite position through movement type 557.
    Using movement type 557, you can correct purchase-order-independent stock in transit if
    -   a good receipt cannot be posted to a purchase order without  stock in transit, even though there is still stock in transit
        according to the purchase order history
    -   stock in transit still exists, even though there are no open  stock transfer orders for the particular material.
    Regards
    Mahesh Naik.

  • ILife 11.1 / iPhoto 9.1 Some slideshows disappeared

    Upgraded to Mac OSX 10.6.5 and all software updates successfully
    Installed iWork 09 and software update successfully
    Upgraded iLife 11.1 (iPhoto 9.1 included) from iLife 09 successfully, software update after said software was current.
    Started iPhoto 9.1 to convert Library, took about 10 minutes, no errors or issues from the software update process.
    Observed only 3 of 8 "creative" slideshows reappeared, although all pictures appear to be there. Creative meaning manually created with much time and effort to get transitions, positioning, ordering and music just right. Lot's of hours invested in the slideshows.
    Remaining slideshows have had the Ken Burns effect eliminated on many slides, and some of the other customizations are missing or modified.
    A few of the pictures in library have changed orientation from upright to sideways or upside down.
    It seems like maybe one problem is causing a series of symptoms. Perhaps file protections issues.
    I'm thinking of restoring iPhoto 8.x.x library, change permissions to 777, and retrying the library conversion in iPhoto 9.1.
    Second try, reinstalling iPhoto 8.x.x and restoring the 8.x.x library, but this would seem like defeat.
    Is there a better way? I'd like to get to iPhoto 9.1 for features and compatibility with Apple training classes.
    Other software tried appears okay after upgrades, such as Office, iWork, and iMovie.
    Any ideas, thoughts or suggestions w.r.t. iPhoto next steps welcome.
    Thanks in advance.

    I have tried restoring 8.x iPhoto library from TM, changed all permissions in iPhoto Library to 777, and converted it to a 9.1 library using iPhoto. Slightly smaller total space usage but basically the same result. Only 3 of 6 (not 8 as originally estimated) albums and slideshows made it through the conversion, missing many of the customized transitions as well.
    The slideshows were originally created inside iPhoto with the "Duplicate" menu item. For some reason, only 1 or each pair made it through the conversion to iPhoto 9.1.

  • I am trying to create a simple animated gif in Photoshop. I've set up my frames and want to use the tween to make the transitions less jerky. When I tween between frame 1 and frame 2 the object in frame two goes out of position, appearing in a different p

    I am trying to create a simple animated gif in Photoshop. I've set up my frames and want to use the tween to make the transitions less jerky. When I tween between frame 1 and frame 2 the object in frame two goes out of position, appearing in a different place than where it is on frame 2. Confused!

    Hi Melissa - thanks for your interest. Here's the first frame, the second frame and the tween frame. I don't understand why the tween is changing the position of the object in frame 2, was expecting it to just fade from one frame to the next.

  • Maintaining keyframe positions during transitions

    Hi all,
    Here's my dilemma: I'm doing a photo montage-based project wherein I have still photos dissolving into one another.
    For each photo I have inserted motion keyframes at the 1st and last frames and have a specific zoom/pan for the duration of that image. I can preview that motion in the viewer and know precisely how it will look for that photo.
    Now comes the hard part: I want to maintain that exact motion throughout that shot, which means maintaining the keyframes at EXACTLY the 1st and last frames. But when I create my transition FCP will add handles before and after my keyframes which means, for example, the motion for the incoming shot doesn't begin until the keyframe is reached. I have to go back into the viewer for each shot and reset the keyframes to match the transition's start & end points.
    In ________, another NLE that I use, I can set my clip's motion, then drag the head of the clip across the tail of the previous clip and the NLE will create whatever default transition I've selected (usually a dissolve). I don't think FCP will do that (please correct me if I'm wrong). But perhaps there is another way to "freeze" the clip's length AND keyframe positions so that the transition always begins/ends on a keyframe?
    Sorry for the lengthy post. Any help is appreciated!
    t leib
    1.8 GHz PowerPC G5   Mac OS X (10.4.9)  
    iMac   Mac OS X (10.4.9)  
    iMac   Mac OS X (10.4.9)  

    "You can key frame earlier and later than the transiston point so that the motion will be maintained."
    Yes, but I want to avoid having to make such changes to the keyframes after I've created the transition. Again, I set the motion for each shot before I create the transition, so that I can view the entire clip, motion included, and know it's what I want. When I create the transition I want it to begin exactly on the keyframe and end exactly on the keyframe. Make sense?
    "You can "Make Free Frame" under the Modify menu"
    I'm sorry for the confusion. I don't want to make a freeze frame, I want the keyframe positions and clip length to be "frozen", meaning they won't change when I create the transition.
    Thanks for the reply, though.
    iMac   Mac OS X (10.4.9)  

  • NB Visual Web JSF Uses Transitional DOCTYPE, Need Strict for position:fixed

    When trying to create a CSS "position:fixed" element in my project that works for Firefox/IE6/IE7 I looked up the simple CSS hacks that need to be used for IE6. Unfortunately, IE6 MUST use a Strict DOCTYPE to accomplish this, and there appears to be no way to change this in the Visual Web projects.
    The only thing I can find is the webuijsf:page element has attributes that depending on their boolean value will toggle between a Transitional and Frameset DOCTYPE.
    Unless someone knows a CSS hack for IE6 that works with a Transitional DOCTYPE, is there a way for me to switch the Visual Web JSF stuff to use a Strict DOCTYPE?

    asherwin wrote:
    Unless someone knows a CSS hack for IE6 that works with a Transitional DOCTYPEGoogle gives lot results if I only search for "position:fixed".
    is there a way for me to switch the Visual Web JSF stuff to use a Strict DOCTYPE?If the documentation doesn't state anything about it, I would report this issue at the mailinglist/issuetracker at the homepage of Visual Web JSF.

  • HCM Position based security: any transition period?

    Hello Gurus, If a person is transferred from one position to another, the next time the RHPROFL0 job runs, it will remove all the old position's roles and assign the new ones it finds from the new position; is it possible to have a transition period(e.g. 15 or 30 days) where the user can have both the old and new roles?
    The Structural PD profiles do have an option to support this but is there a way to do this for all normal ABAP roles assigned to the Positions using the relationship infotype?
    Thanks,
    Arya

    Hi Arya
    Yes..this is possible by using the structural switch - AUTSW ADAYS. This switch is used to specify the tolerance time for authorization check in the event of org or position change. I think by default the switch is off.(not sure). If you do not want user to lose old authorization during the transition period you can activate the switch (I think default is 15 calendar days).
    Hope this helps
    Regards
    Santosh kumar

  • My clip timing and transition points won't save at desired positions, anyone else having this issue, it crashes as well.

    My clip timing and transition points won't save at desired positions, anyone else having this issue, it crashes as well.

    Could you share the crash log here? Thanks!

  • Image scrambled position with doctype transitional

    Good Mornig.
    I have made a site, using a Photoshop CS4 to get an table slicing page, then work in DWCS4.    In the top of the page, in first row we have include an swf, en second row two gif's with a link, in third row -split in two cols- we have included anhother swf and text from db.
    the problem is that usign a transitional doctype the upper swf some times show any place in the page but not a its position.  We fixed in css rule, and now the two gifts are playing around the page.  The problem gets worst, due that in a  IE8 / Vista the problem doesn't show but in IE8/xp  the problem shoews, but doesn't happend always.  
    any idea why this happen.
    Thaks for your help

    Got a link to your website?
    It's easier than trying to visualize written descriptions.

  • No fluent position transition

    I use a linear position transition over the X-axis from value 1000 to 0 and then to -1000. But the picture does not move fluent, also not after rendering in h.264, 25fps (project setting also 25fps).
    It's a black background.
    Any ideas?

    There is a lot of *stuff* that goes on in Motion that can keep what you see from looking "smooth". Firstly, Motion is not a video editor, per se... it is a composting application. When you play the project, chances are, depending on how complicated your project is (in your case, the format and size of the photo.) Other things, like your processor speed, amount of RAM, video card (hardware stuff) can also affect how efficiently Motion can play back in "real time."
    When you export a project, Motion's default is ProRes 4444. That is not a codec for playback as the files are huge (and ProRes is designed for editing). To get the best, most efficient playback format, export your project as H.264. Regardless of how a project plays in Motion, once exported in a playable codec, the project should look considerably smoother. However, if you are going to move the project, as exported video, to another NLE (like FCPX) then you should export the final version as ProRes (even if it doesn't play well in a player.)

  • Swapping between music, pictures, transitions etc - Rests your position...

    Aside from the fact that video effects are gone, which takes out almost all the creativity of iMovie... I have a gripe that is really, really annoying. When you swap between adding music, pictures, and transitions iMovie 08 resets where you were in any other item... So if your adding a few photos and you want to bounce between adding transitions to them or sound, you loose your place. This is awful if you have a huge library of either photos or music, you're forced to scroll all the way back through to get to what you were working with. I rushed out to buy iLife 08 specifically for iMovie, this is such a let down...

    Windows is absolutely passing the buck, and what is more, they are doing it in hopes that we will pass them more bucks- Windows 7 offered a program (for free) that was called windows media center.  Windows 8 does not have this however, they will suggest
    that it you pay an additional $99.99 to upgrade to windows pro and THEN another $9.99 for windows media center, all will be fine in the media sharing department....
    UNTRUE-
    I have Windows 8 and fresh out of the box, I got an app called XBox Smartglass with my new (and supposedly improved) OS, Windows 8.  Therefore, it is an OS issue, not a manufacturing issue or an Xbox issue or where ever else you may want to stream your
    media to.
    However, for whatever reason, I have been able to share media without upgrading or paying anything with not one, but two Xbox's...It has something to do with permissions, sharing, devices, networks...but don't ask me what, I truly, truly wish I could help
    everyone...however, I just do not want windows weaseling more money out of already high paying customers. 
    Sometimes I right click on a pie of media and I receive a 'Play To' option.  Sometimes that options offers me to 'Play To' 'The Dark Box' or 'Xbox 360' or one but not the other or; my personal favorite- the 'Play To' option is gone and the only option
    is to 'Open With' the various media outlets on my PC but not stream it anywhere...and there is no rhyme or reason or setting that makes this consistent.
    I wish I could help more, but I leave you with this- It is possible, It does have to do with Windows OS, and you do not have to pass anymore bucks their way to make it happen...

  • Issue with container divs, and absolute/fixed positioning

    Hello everyone, I have an issue getting my divs to function properly. I have a container div and I want the table div to float inside (and move with page resize). Right now it doesnt move with the page (see photo).
    However, when I change the position to relative of that div, it moves under the container div and locks itself there.(Second photo)
    Any help would be great! Thanks!
    Picture one:
    Picture two
    <!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" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>davide marchetti architetto</title>
    <!-- TemplateEndEditable -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
    <link href="ttp://mottie.github.com/tablesorter/css/theme.blue.css" rel="stylesheet">
    <script type="text/javascript" src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.js"></script>
    <script type="text/javascript" src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.widgets.js"></script>
    <script type="text/javascript">
    $(document).ready(function()
            $("#myTable").tablesorter();
    </script>
    <style type="text/css">
    body {
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background-color: #FFFFFF;
    margin: 0;
    padding: 0;
    color: #000;
    background-image: url();
    background-repeat: no-repeat;
    /* ~~ 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. */
    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;
    /* ~~ 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;
    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%. */
    /* ~~ This is the layout information. ~~
    1) Padding is only placed on the top and/or bottom of the div. The elements within this div 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.
    .content {
    padding: 10px 0;
    font-size: x-small;
    /* ~~ 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. */
    /* ~~ 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;
    body,td,th {
              font-family: "Courier New", Courier, monospace;
              font-size: 12px;
    #apDiv1 {
    position: relative;
    width: 618px;
    height: 268px;
    z-index: 1;
    left: 186px;
    top: 147px;
    overflow: hidden;
    #apDiv2 {
              position: relative;
              width: 698px;
              height: 299px;
              z-index: 1;
              left: 266px;
              top: 117px;
              overflow: scroll;
    table.tableizer-table {
    border: 1px solid #CCC; font-family: Courier New, Courier, monospace;
    font-size: 12px;
    .tableizer-table td {
    padding: 4px;
    margin: 3px;
    border: 1px solid #ccc;
    .tableizer-table th {
    background-color: #000000;
    color: #FFF;
    font-weight: bold;
    #apDiv4 {
    position: relative;
    width: 697px;
    height: 299px;
    z-index: 1;
    left: -141px;
    top: -636px;
    overflow: scroll;
    #apDiv3 {
    position: relative;
    width: 700px;
    height: 300px;
    z-index: 2;
    h1,h2,h3,h4,h5,h6 {
    font-family: "Courier New", Courier, monospace;
    </style>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    </head>
    <div class="container">
      <div class="container"><img src="../images/Davide.png" width="800" height="600" usemap="#Map" border="0" />
        <div id="apDiv2">
          <map name="Map" id="Map">
            <area shape="rect" coords="48,416,125,435" href="../news.html" />
            <area shape="rect" coords="262,416,304,436" href="../studio.html" />
            <area shape="rect" coords="490,416,545,435" href="../projects.html" />
            <area shape="rect" coords="702,415,751,436" href="../contact.html" />
          </map>
          <table id="myTable" class="tableizer-table">
            <thead>
              <tr class="tableizer-firstrow">
                <th>YEAR </th>
                <th>PROJECT</th>
                <th>LOCATION</th>
                <th>CATEGORY</th>
                <th>STATUS</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td>2013</td>
                <td>EXPO 2015 - Italian Pavilion</td>
                <td>Milan - Italy</td>
                <td>Culture</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td>2012</td>
                <td>Requalification of "Almerici", "Bufalini" and "Fabbri" Squares</td>
                <td>Cesena - Italy</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Re-thinking Shanghai: sustainable intervention along the Suzhou Creek</td>
                <td>Shanghai - China</td>
                <td>Mixed use</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>VCC Flat</td>
                <td>Rome - Italy</td>
                <td>Interior design</td>
                <td>Commission / Built</td>
              </tr>
              <tr>
                <td>2011</td>
                <td>London 2012 Olympic Games Information Pavilion</td>
                <td>London - UK</td>
                <td>Culture</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Enhancement project for the sacred area of the sanctuary of Hercules Victor</td>
                <td>Tivoli - Italy</td>
                <td>Culture</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td>2010</td>
                <td>VTL Flat </td>
                <td>Rome - Italy</td>
                <td>Interior design</td>
                <td>Commission / Built</td>
              </tr>
              <tr>
                <td> </td>
                <td>BNC Flat</td>
                <td>Rome - Italy</td>
                <td>Interior design</td>
                <td>Commission / Built</td>
              </tr>
              <tr>
                <td> </td>
                <td>Expansion of the "Farnesina" High School</td>
                <td>Rome - Italy</td>
                <td>Education</td>
                <td>Competition / Selected Project</td>
              </tr>
              <tr>
                <td> </td>
                <td>Neanderthal Art Center</td>
                <td>Pilo�a - Spain</td>
                <td>Culture</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>New pedestrian & cycling footpath in the site of the "San Leopoldo II" old bridge</td>
                <td>Poggio a Caiano - Italy</td>
                <td>Infrastructure</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Proposition 2065 - St. Leonards site</td>
                <td>Sidney - Australia</td>
                <td>Mixed use</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>MEIS - National Museum of Italian Judaism and Shoah </td>
                <td>Ferrara - Italy</td>
                <td>Culture</td>
                <td>Competition / 3rd Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>36 The Calls Design Competition</td>
                <td>Leeds - UK</td>
                <td>Offices</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Europan 10: masterplan for an harbour area</td>
                <td>Rudk�bing - Denmark</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td>2009</td>
                <td>"Scuola in Piazza a Levante" - Kindergarten and public areas</td>
                <td>Bisceglie - Italy</td>
                <td>Education</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>CIBAF - City of Kids </td>
                <td>Frattamaggiore - Italy</td>
                <td>Education</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Designing in Teheran</td>
                <td>Teheran - Iran</td>
                <td>Mixed use</td>
                <td>Competition / Selected Project</td>
              </tr>
              <tr>
                <td>2008</td>
                <td>DawnTown 2008: Waterworks</td>
                <td>Miami - USA</td>
                <td>Mixed use</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Venice Biennale New Australian Pavillion</td>
                <td>Venice - Italy</td>
                <td>Culture</td>
                <td>Competition / 1st Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>New pedestrian and cycling bridge</td>
                <td>Civita di Bagnoregio - Italy</td>
                <td>Infrastructure</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Renovation of "San Ciro" Square</td>
                <td>Portici - Italy</td>
                <td>Urban planning</td>
                <td>Competition / 2nd phase selected / 3rd Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>Renovation of "Umberto I�" Square</td>
                <td>San Ferdinando di Puglia - Italy</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Historic Renovation of the "Corsie Sistine" Hospital Wards </td>
                <td>Rome - Italy</td>
                <td>Culture</td>
                <td>Tender Competition (design/bid/build)</td>
              </tr>
              <tr>
                <td> </td>
                <td>Cupboard</td>
                <td>Rome - Italy</td>
                <td>Furniture design</td>
                <td>Commission / Built</td>
              </tr>
              <tr>
                <td> </td>
                <td>Office table and lighting system</td>
                <td>Rome - Italy</td>
                <td>Furniture design</td>
                <td>Commission / Built</td>
              </tr>
              <tr>
                <td> </td>
                <td>New City Library</td>
                <td>Legnano - Italy</td>
                <td>Library</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Office table</td>
                <td>Rome - Italy</td>
                <td>Furniture design</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td> </td>
                <td>Volleyball Arena, Hotel and Commercial Spaces</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td>2007</td>
                <td>New Provincial Archaeological Museum in the Santa Scolastica Monastery</td>
                <td>Bari - Italy</td>
                <td>Culture</td>
                <td>Competition / 5th Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>The City of Water and Health</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Parkway Iconic Bridge</td>
                <td>Sheffield - UK</td>
                <td>Infrastructure</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Renovation of "Loveno 84" Sport Center</td>
                <td>Menaggio - Italy</td>
                <td>Sport</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>"Guardia di Finanza" Corp Main Headquarters</td>
                <td>Catanzaro - Italy</td>
                <td>Mixed use</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>"Lega Lombarda" Real Estate Complex Urban Development</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Tender Competition (design/bid/build) </td>
              </tr>
              <tr>
                <td> </td>
                <td>Necklace</td>
                <td>Rome - Italy</td>
                <td>Jewellery design</td>
                <td>Prototype </td>
              </tr>
              <tr>
                <td> </td>
                <td>Moon putter</td>
                <td>Rome - Italy</td>
                <td>Product design</td>
                <td>Prototype</td>
              </tr>
              <tr>
                <td> </td>
                <td>Aleale Coffee Table</td>
                <td>Rome - Italy</td>
                <td>Furniture design</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td>2006</td>
                <td>"1st October" Public Square</td>
                <td>Santa Maria Capua Vetere - Italy</td>
                <td>Urban planning</td>
                <td>Competition / 1st Prize / Built</td>
              </tr>
              <tr>
                <td> </td>
                <td>"Attilio Pecile" New Square and Sustainable Mixed Use Building</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Competition / 1st Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>Renewal of the "Porta Nuova" Old Tower</td>
                <td>Venice - Italy</td>
                <td>Culture</td>
                <td>Competition / 2nd Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>"Meno e pi� 4": Civic Center and Pre-school Building</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Competition / Mention</td>
              </tr>
              <tr>
                <td> </td>
                <td>Urban Renewal of Historic Building and Public Squares</td>
                <td>Conversano - Italy</td>
                <td>Urban planning</td>
                <td>Competition / 2nd Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>New Seafront and Beach Accesses</td>
                <td>Fregene - Italy</td>
                <td>Urban planning</td>
                <td>Competition / Mention</td>
              </tr>
              <tr>
                <td> </td>
                <td>Requalification of Main Streets and Squares of the Old City Centre</td>
                <td>Bari - Italy</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Gyeonggi-do Jeongok Prehistory Museum</td>
                <td>Jeongok-ri - South Korea</td>
                <td>Culture</td>
                <td>Competition / Honourable Mention</td>
              </tr>
              <tr>
                <td> </td>
                <td>Low-income housing development</td>
                <td>Guadalajara/Ceuta - Spain</td>
                <td>Residential</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Shop extension</td>
                <td>Rome - Italy</td>
                <td>Retail</td>
                <td>Commission / Concept Design</td>
              </tr>
              <tr>
                <td> </td>
                <td>Temporary Concert Hall</td>
                <td>Rome - Italy</td>
                <td>Culture</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td> </td>
                <td>Office Space Interior Design - New Seat of the Lombardy Regional Government </td>
                <td>Milan - Italy</td>
                <td>Office</td>
                <td>Tender Competition (design/bid/build)</td>
              </tr>
              <tr>
                <td>2005</td>
                <td>Europan 8 - Urban Requalification</td>
                <td>Istanbul - Turkey</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Natural Park Visitor Center, Kindergarten and Primary School</td>
                <td>Funes - Italy</td>
                <td>Education</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Coastal Area Development</td>
                <td>Latina - Italy</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Requalification of Three Squares</td>
                <td>Benevento - Italy</td>
                <td>Urban planning</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Office and Data Center New Building in the Ministry of Defense headquarters</td>
                <td>Rome - Italy</td>
                <td>Office</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td>2004</td>
                <td>JCD Floating Pearl Store</td>
                <td>Tokio - Japan</td>
                <td>Retail</td>
                <td>Competition / 2nd phase selected </td>
              </tr>
              <tr>
                <td> </td>
                <td>Requalifications of Rome�s Beachfront and Coastal Areas</td>
                <td>Ostia - Italy</td>
                <td>Urban planning</td>
                <td>Competition / 1st Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>40 Apartments Building and Sport Center</td>
                <td>Rome - Italy</td>
                <td>Mixed use</td>
                <td>Competition / 2nd Prize</td>
              </tr>
              <tr>
                <td> </td>
                <td>nMBA New Beaux-Art Museum</td>
                <td>Lausanne - Switzerland</td>
                <td>Culture</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>The Dubai Residence and Hotel Towers</td>
                <td>Dubai - UAE</td>
                <td>Mixed use</td>
                <td>Concept Design</td>
              </tr>
              <tr>
                <td> </td>
                <td>Shoes and Accessories Shop</td>
                <td>Rome - Italy</td>
                <td>Retail</td>
                <td>Commission / Concept Design</td>
              </tr>
              <tr>
                <td>2003</td>
                <td>Pedestrian and cycling Bridge </td>
                <td>Rome - Italy</td>
                <td>Infrastructure</td>
                <td>Competition</td>
              </tr>
              <tr>
                <td> </td>
                <td>Temporary Pavillion for a Car Show</td>
                <td>Rome - Italy</td>
                <td>Retail</td>
                <td>Commission / Concept Design</td>
              </tr>
              <tr>
                <td> </td>
                <td>Belvedere Tower</td>
                <td>Castellammare di Stabia - Italy</td>
                <td>Infrastructure</td>
                <td>Concept Design</td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
    <!-- end .container --></div>
    </body>
    </html>

    #apDiv2 {
        position: absolute;
        width: 698px;
        height: 299px;
        z-index: 1;
        left:50px;
        top: 117px;
        overflow: scroll;
    Don't forget to fix your code errors.  You're still missing a <body> tag in your markup. 
    Nancy O.

  • Spry Menu Bar disappears absolute position

    Hello all this is my first time posting on this site so bear with me. I have a semi-transperant spry menu bar that i inserted into the header div, over an image. I moved the menu bar -38px, when the position is set to relative the menu bar is visible, however the old position of the menu bar has a blank white space there. I think this is due to the relative position property. When i change it to absolute the whole menu bar disappears? http://www.brightlikethesun.com/index2.html (the position is back to relative to show the menu bar and also background for header is blue to show the space) 
    CSS
    /* 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
    width: 100%;
    margin: auto;
    position: relative;
    top: -38px;
    font-family: "Lucida Console", Monaco, monospace;
    opacity: 0.7;
    filter: alpha(opacity=60); /* For IE8 and earlier */
    margin-right: auto;
    margin-left: auto;
    /* 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
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 20%;
    float: left;
    /* 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-family:Arial, Helvetica, sans-serif;
    font-size: 70%;
    z-index: 1020;
    cursor: default;
    width: 50em;
    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: 50em;
    /* 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;
    padding: 0.5em 0.75em;
    color: #C0C0C0;
    text-decoration: none;
    background: rgba(98, 135, 167, .4)
    background: #45484d; /* Old browsers */
    background: -moz-linear-gradient(top, #45484d 0%, #000000 50%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #45484d 0%,#000000 50%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #45484d 0%,#000000 50%); /* IE10+ */
    background: linear-gradient(to bottom, #45484d 0%,#000000 50%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
    /* 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;
    background: #7d7e7d; /* Old browsers */
    background: -moz-linear-gradient(top,  #7d7e7d 0%, #0e0e0e 50%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 50%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 50%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 50%); /* IE10+ */
    background: linear-gradient(to bottom,  #7d7e7d 0%,#0e0e0e 50%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
    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;
    html 
    <!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>Bright Like The Sun -- San Antonio, TX</title>
    <style type="text/css">
    <!--
    body {
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background-color: #000000;
    margin: 0;
    padding: 0;
    color: #000;
    background-image: url(background.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: 5px; /* 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-family: Tahoma, Geneva, sans-serif;
    color: #000;
    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;
    /* ~~ 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-color: #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%. */
    /* ~~ 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-color:#06C
    /* ~~ 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%;
    padding-bottom: 0px;
    background: #f1da36; /* Old browsers */
    background: -moz-linear-gradient(left, #f1da36 0%, #fefcea 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f1da36), color-stop(100%,#fefcea)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #f1da36 0%,#fefcea 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #f1da36 0%,#fefcea 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #f1da36 0%,#fefcea 100%); /* IE10+ */
    background: linear-gradient(to right, #f1da36 0%,#fefcea 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1da36', endColorstr='#fefcea',GradientType=1 ); /* IE6-9 */
    .content {
    padding: 0px 0;
    width: 80%;
    float: left;
    /* ~~ 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 footer ~~ */
    .footer {
    padding: 10px 0;
    background-color: #000000;
    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-family: "Comic Sans MS", cursive;
    /* ~~ 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;
    #menurules {
    margin: 0px;
    padding: 0px;
    -->
    </style>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <!--[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>
    </head>
    <body>
    <div class="container">
      <div class="header"><a href="#"><img src="BLTS1.jpg" alt="BLTS" name="BLTS" width="100%" height="100%" id="BLTS" style="display: block;" /></a>
       <ul id="MenuBar1" class="MenuBarHorizontal">
         <li><a class="MenuBarItemSubmenu" href="#"><center>Home</center></a></li>
         <li><a href="#"><center>Shows</center></a>
    <ul>
             <li><a href="#"><u>Upcoming shows</u><br />
    <br />
    May 4th 2013 @<img src="502.jpg" width="5%" height="5%"><br />
    Bright Like The Sun along with Little Science<br />
    8pm 21+
    </a></li>
                   </ul>
         </li>
         <li><a class="MenuBarItemSubmenu" href="#"><center>Merch</center></a>
           <ul>
             <li><a class="MenuBarItemSubmenu" href="#"><u>Album</u><br /><img src="coda fin cover.jpg" width="15%" height="15%"><font size="4">Coda Fin</font><br />
    Purchase Here or Itunes</a>
                        </li>
             <li><a href="#">Shirts--Coming Soon!</a></li>
             <li><a href="#">Various--Coming Soon!</a></li>
           </ul>
         </li>
         <li><a href="#"><center>Bio</center></a></li>
    <li><a href="#"><center>Contact</center></a></li>
    </ul><!-- end .header --></div>
    <div class="sidebar1">
      <p></p>
        <br />
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
      </div> 
      <div class="content"><p align="right"><a href="https://www.facebook.com/brightlikethesun"><img src="FB.jpg" width="30" height="31" alt="Facebook" /></a><img src="twitter-icon.png" width="30" height="31" /></p>
        <p align="left"><img src="weare.jpg" width="185" height="72" /></p><p align="right"><iframe style="border:none" src="http://files.podsnack.com/iframe/embed.html?hash=adznldvg&t=1366488970" width="340" height="54" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" ></iframe></p>
        <p><img src="BLTS2.jpg" alt="BLTS" width="411" height="297" align="left" /><img src="BLTS font.jpg" width="340" /> is a Post-Rock band from San Antonio. They were born in early 2012 from the collective desire to make beautiful, thought provoking, and at times, chaotic music. Much like fellow Texan bands like Explosions in the Sky and This Will Destroy You, they are entirely instrumental, and known for creating progressively intricate waves of ambiance that grow with intensity and an unabashed wash of emotion. Attuned to their affinity for dynamics, seeing them live takes the listener from deafening walls of orchestrated sound, to melodies so subtle that one finds themselves acutely aware of their own breathing. <br />
          Bright Like The Sun&rsquo;s debut album, Coda Fin, was engineered/mixed by Alex Bhore (of This Will Destroy You), and mastered by TW Walsh (of Pedro The Lion). The record, which was self released, was made available on April 12, 2013.<br /><br /><img src="BLTS3.jpg" width="330" height="245" align="right" /></p>
    <br />
    <br />
        <h4>Bright Like The Sun Consists of:</h4>
        <p>Rob Mochen - Guitar <br />
        Chris Etheredge - Guitar/Keys <br />
        Christian Miranda - Bass <br />
        Steven Barrera - Drums    </p>
        <p><br />
        </p>
        <h4><u>Coda Fin</u> Release Date April 12th 2013    </h4>
        <h4><img src="coda fin cover.jpg" width="250" height="238" align="left" /><img src="venues.jpg" width="171" height="65" align="right" /><br />
        <br />
        <br />
        <br />
           <a href="http://502bar.com/"><img src="502.jpg" width="150" height="112" align="right" /></a><a href="http://www.gypsyloungeaustin.com"><img src="gypsylounge.jpg" / width="150" height="112" align="right"></a></h4>
        <p align="right"> </p>
      </div>
      <div class="footer">
        <p><font face="verdana" font size="2" font color="#FFFFFF">&#169;2013 Bright Like The Sun All Rights Reserved</font></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>

    What I see:
    You need a width on the ul.MenuBarVertical style. Make it the same width as the ul.MenuBarVertical li selector.
    Remove the float: none; from this style:
    ul.MenuBarVertical ul li
         width: 12em;
         float: none;
    No such measurement as a half a pixel:
    ul.MenuBarVertical ul
         border: .5px solid #CCC;
    If you want a border, 1px is minimum...you repeat this incorrect half-pixel in several places.
    Running your page through the W3C Validator returned this: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.healthydirections.ca%2F&charset=%28dete ct+automatically%29&doctype=Inline&group=0
    Your initial errors are not declaring a DOCTYPE, which among other things, does not provide the browser with any information regarding how you want the code interpreted for your viewer. Some browsers guess well, some do not (IE).
    This
         <html>
    is insufficient.
    Apply this in its place, and run through the validator again.
    <!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">
    Beth

  • How do I add a before and after transition to a standalone clip in the second or other than primary stack?

    New to FCPX on a project this weekend. I have gotten reasonably comfortable with the basic features but one thing that I CANNOT figure out, is how (what used to be) selecting a track in the timeline to activate it to apply a transition.  I need to select a video clip which stands alone in the stack which is positioned above the primary track and add a blend transition before and after the clip. I have set the opacity to blend with the images in the primary track below but the beginning and end of the clip in the second stack do not fall at the transition points in the lower track which should not matter anyway.  I can’t find it in Help or the third party tutorials that I purchased and completed.  Thanks for your help!

    Tom gave you the answer.  As a follow-on you can then use the Cross Dissolve transition on your newly converted connected clip.  This transition will allow it to dissolve smoothly into the video below it.  Note that the Fade to Black transition will take both that clip and the video below it to black which would probably be undesirable. Use Cross Dissolve instead.  Best wishes.
    stephen

Maybe you are looking for

  • Error while creating VO dynamically and assigning it to Table Region

    Hi, I am getting the below exception while running my OAF page oracle.apps.fnd.framework.OAException: Programming error. Row (oracle.jbo.server.ViewRowImpl@1e) must be of type oracle.apps.fnd.framework.OARow. I've created a dynamic VO using createVie

  • MP3 files not showing in iTunes on new iMac

    Hi - I have recently purchased my first Mac computer.  I have copied over all of my music but it seems that all the MP3 files are not playing.  It's strange they show in my folder list of itunes and it lets me play them, but in the main itunes folder

  • Performance Issue: Update Statement

    Hi Team, My current environment is Oracle 11g Rac... My application team is executing a update statement (ofcourse it is there daily activity) ... updating rows of 1 lac, daily it takes about 3-4 minutes to run the statement. But today its taking mor

  • IE or Contract Management v13 thinks my DOCX file is a zip

    When trying to open an attachment IE or Contract Management v13 thinks my DOCX file is a zip. This started last Thursday. Outta the blue. We've been searching for a days now for a solution. Nothing has helped. I have a few hundred users all with vari

  • How: Script archive log transfer to standby db

    Hi, I'm implementing disaster recovery right now. For some special reason, the only option for me is to implement non-managed standby (manual recovery) database. The following is what I'm trying to do using shell script: 1.     Compress archive logs