Centering a horizontal image with label list...

Hi there,
Image list is aligned to the left by default. I'd like to know if it's possible to aligned it to the center of page? If so, please educate me... Thank you in advance...
Chris :)
Edited by: Chris K.W. on Dec 11, 2009 8:54 AM

You've caused very little hassle. Microsoft on the other hand...
To do this using CSS you have to account for bugs in IE, meaning it takes 4 times longer than it needs to. We won't go into the ensuing unfortunate chain of events involving VMs, but it meant that I couldn't test this on IE8.
1. Set the template for the containing region to "No Template".
2. To cope with Microsoft's broken browsers, enter
<!--[if lt IE 8]>
<div style="text-align: center;">
<![endif]-->in the Region Header, and
<!--[if lt IE 8]>
</div>
<![endif]-->in the Region Footer.
3. Add this internal style sheet to the page HTML Header
<style type="text/css">
.t13HorizontalImageswithLabelList {
  margin-left: auto;
  margin-right: auto;
</style>If it doesn't work in IE8 then try removing 'lt' and '8' in step 2.
This will center all Horizontal Images with Label Lists on a page: we can change this if necessary, but will skip redundant code if it's not required.

Similar Messages

  • Image With Title

    Hi, how are all of you? I wonder if it is possible to have an Image with Label or Title that display along with the Image itself as a single object.
    Thanks
    .:.Wahab

    Sure. In this example the image path and caption are in an XML file, and I am putting the images in:
    1) a HorizontalList
    2) a List
    3) individual Panels using a Repeater
    The images I am using are in a folder "images" under the folder containing MainApp.mxml
    --------------- data.xml ---------------------
    <?xml version="1.0" encoding="utf-8"?>
    <photos>
        <photo>
            <image>images/red30_30.JPG</image>
            <caption>Red Square</caption>
        </photo>
        <photo>
            <image>images/green30_30.JPG</image>
            <caption>Green Square</caption>
        </photo>
        <photo>
            <image>images/blue30_30.JPG</image>
            <caption>Blue Square</caption>
        </photo>
        <photo>
            <image>images/black30_30.JPG</image>
            <caption>Black Square</caption>
        </photo>
    </photos>
    ------------------ MainApp.mxml ------------------------
    <?xml version="1.0"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
      creationComplete="photosRequest.send();">
      <mx:Script>
        <![CDATA[
          import mx.rpc.events.ResultEvent;
          import mx.collections.XMLListCollection;
          [Bindable] private var xlc:XMLListCollection;
          private function photosHandler(evt:ResultEvent):void{
            xlc = new XMLListCollection(evt.result..photo); 
        ]]>
      </mx:Script>
      <mx:HTTPService id="photosRequest" url="data.xml" result="photosHandler(event)"
        resultFormat="e4x"/>
      <mx:HBox width="100%" horizontalAlign="center" horizontalGap="30">
        <mx:HorizontalList dataProvider="{xlc}" rowHeight="100"
          columnWidth="100">
          <mx:itemRenderer>
            <mx:Component>
              <mx:VBox horizontalAlign="center" verticalAlign="middle">
                <mx:Image source="{data.image}"/>
                <mx:Text text="{data.caption}"/>
              </mx:VBox>
            </mx:Component>
          </mx:itemRenderer>
        </mx:HorizontalList>
        <mx:List dataProvider="{xlc}" rowHeight="100"
          columnWidth="100" height="405" width="110">
          <mx:itemRenderer>
            <mx:Component>
              <mx:VBox horizontalAlign="center" verticalAlign="middle">
                <mx:Image source="{data.image}"/>
                <mx:Text text="{data.caption}"/>
              </mx:VBox>
            </mx:Component>
          </mx:itemRenderer>
        </mx:List>
        <mx:HBox>
          <mx:Repeater id="rp" dataProvider="{xlc}">
            <mx:Panel title="{rp.currentItem.caption}">
              <mx:Image source="{rp.currentItem.image}"/>
              <mx:Text text="{rp.currentItem.caption}"/>
            </mx:Panel>   
          </mx:Repeater>
        </mx:HBox>
      </mx:HBox>
    </mx:Application>

  • Horizontal menu with horizontal sub menu using image rollovers or similar

    Hello,
    I am brand new to web design and working on my first site.  What I lack in skills, I have in free time to learn right now : ) Please let me know if there is a tutorial or other resource that describes what I am trying to do...I've been searching for days and just can't find what I'm after.
    The design concept is a menu of main categories that apear to be floating over an object.  When you hover over one, it looks like it gets pressed down in space resulting in the next line populating with subcategories to be selected.  If you click on the main elements, you would be directed to that page - Services for instance.  If you just hovered over a main category, you would be presented with a list of sub-categories that behave in the same fashion.  If you then clicked on one of the sub-categories, you would be taken to that specific page.
    Here's a sequence of images that show what I'm after.
    I built all this in Illustrator as described in a Lynda.com tutorial.  I then exported slices to dreamweaver and started building content.  Each of the categories and sub categories is a separate slice with images built for the rollovers.  I was able to build the main categories and get them to visually sink upon using an imageswap...now I'm stuck on how to get the second line to behave as I described.
    This is a fun learning experience.  Let me know if there is a better way to achieve the design.  I just stared investigating SSIs as well and see the value in having this menu in just one place, referenced into all my subsequent pages.  I have successfully embeded an SSI footer with rollovers on my page, but this menu problem is really tough for me.
    I really appreciate any pointers.
    Thanks,
    Jeff Prince

    I tried building a Spry Horizontal menu to get what I want, but I had no success there.  Any tips for that?
    On a separate note...I do not know if it is proper to use a 'tabbed panel' for my menu project, but it seems to work fine.  I have built both the top (main category) and bottom (sub category) lines of my menu using spry with .png image rollovers.
    Now I just need to find out how to make the main category button rollover stay 'down' while browsing the subcategories.  I would also like to get the subcategories to populate upon mouseover of the main category, without requiring a selection.  Now that would be slick : )  In my example above, the 'services' title should be depressed while in that submenu and look like 'landscape design'.
    One minor problem is the space created between my subcategory images.  I can't find the .css or .js that is creating that space.  I've really trimmed down all the .css and do not know where else to hunt.
    Thanks for any advice,
    Jeff

  • Horizontal image list in theme 20

    Hi,
    Does anyone know how to control the width of the horizontal image list in theme 20? Because the length of each text link below the image is different, some of the are longer than others, it causes some of the icon links to become wider than others. I want them to appear with the same width. The text link should automatically expand to different line as needed.
    Thanks.
    Andy

    Hi,
    The following is the template for the horizontal image list. Can anyone show me how to make the text (below image) to wrap and align within the width of the image so that the horizontal space between the images will be the same?
    Thanks.
    Andy
    <pre>
    List Template Before Rows (for example <table> <tr>):
    <table class="t20HorizontalImageswithLabelList" cellpadding="0" border="0" cellspacing="0" summary=""><tr>
    List Template Current:
    <td class="t20current"><img src="#IMAGE_PREFIX##IMAGE#" border="0" #IMAGE_ATTR# />
    #TEXT#</td>
    List Template Noncurrent:
    <td><img src="#IMAGE_PREFIX##IMAGE#" border="0" #IMAGE_ATTR#/>
    #TEXT#</td>
    List Template After Rows (for example </tr> </table>):
    </tr></table>
    </pre>

  • Is it possible to export a file from Organizer with the list of all the images in an album?

    Is it possible to export a file from Organizer with a list of all the images in a certain album? In filling one of my albums I did not save my edited images to the same file... they are spread out a bit.... Now I want them to make a book with them (outside of Elements).

    As far as I know, Elements does not have the ability to create lists.
    The solution to your problem of making a book outside of Elements is to place all the desired photos in an Album and then select File->Export->As New Files which gives you the ability to make a copy of every photo in the album in a new folder, from which you would create your photobook.

  • How to adjust the space between images in a carousel or images with horizontal scroll

    I use the next steps to create a carousel or horizontal scroll of images:
    Webcenter portal: Spaces
    Spaces
    Manage Settings
    Pages
    Create page
    Content management
    Content presenter
    Add images with Plus Icon
    It works, but between every image has a lot of space, can you tell me how to reduce the space between every image.
    My Oracle Version 11gR1 (11.1.1.3.0)
    Regards
    Tomas Reyes

    Remove line 234 in your HTML code.
    <p>& n b s p</p>
    This is a redundant line of code. Your spacing should get resolved.
    PS: I've given spaces between the tag because otherwise this forum would not display the line correctly.

  • Loading images with different horizontal sizes

    I would like to load images with different horizontal
    resolutions (vertical resolution to be the same) dymanically into
    an empty movie clip. I would like them to load with the right hand
    side of the image lined up with the right hand side of my site. I
    have seen many tutorials about how to accomplish the loading of the
    movies, but I cannot figure out how to make them open with the
    right hand side always lined up on the right.
    To be more specific, let's say I have three images of the
    varying pixel resolutions (1200x600, 800x600, and 400x600 for
    example). I would like the horizontal size to always extend away
    from the right hand side of the site with the right hand edge of
    the images always lined up.
    Is this possible to do by loading them into an empty movie
    clip?
    thanks

    When you load an image file into an empty movieClip, that
    clip takes on the dimensions of the loaded content. The
    registration point for the clip is set to the upper left corner.
    So, once the new image is loaded, just set that clip's .x to the
    stage width - the width of the clip.

  • Firefox upon opening an image in a new tab, centers the image from top and bottom and surrounds the image with a grey frame. Just started having the problem today, searched Google to no avail.

    Firefox upon opening an image in a new tab, centers the image from top and bottom and surrounds the image with a grey frame. Just started having the problem today, searched Google to no avail.

    Oh wow, looks like a new feature.
    The "page" links in a stylesheet with the address "resource://gre/res/TopLevelImageDocument.css". If you remove that reference, then the image displays in the old style.
    '''''Edit: Please skip the rest of this post and check out the next one.'''''
    There might be a more elegant solution than that, but you could use a bookmarklet to strip out that link when you want to view the page in its old style. A bookmarklet is a snippet of JavaScript you save on the Bookmarks toolbar for quick access.
    First, copy the following code to the clipboard (it's all one long line):
    <br>javascript:var ssheet=document.querySelector('link[href="resource://gre/res/TopLevelImageDocument.css"]'); if(ssheet)ssheet.parentNode.removeChild(ssheet); void 0;
    Next, if you are not displaying the Bookmarks Toolbar, use View > Toolbars > Bookmarks Toolbar to display it. (If you aren't using the classic Menu bar, press Alt+v to call up the old View menu. Right-clicking the gray area just below the page address also allows you to display the Bookmarks Toolbar.)
    Right-click on the Bookmarks Toolbar (or Mac equivalent of right-click!) and choose New Bookmark.
    Paste the code into the Location box (the second box).
    Then type a useful name in the Name box (e.g., Oldstyle Picture) and click Add.
    Now, when you want to tweak the image display, click the button to run the script.
    Manual clicking is a hassle, so it might make sense to look into other solutions. (Greasemonkey didn't seem to work; I think it might not run on .jpg files.)

  • DHTML List (Image) with Sublist and authorization problems

    Dear all -
    I wonder if anyone can help with this DHTML drop-down menu query:
    We use hierarchical menus implemented as DHTML Lists (Image) with Sublists. When some of the items are hidden through authorization, the wrong headers appear for the menus.
    For example:
    Menu
      Item 1
        Subitem 1 of Item 1
        Subitem 2 of Item 1
      Item 2
        Subitem 1 of Item 2
        Subitem 2 of Item 2
    Say Item 1 and its subitems are all hidden through authorization controls. The heading for Item 2 then appears as 'Subitem 2 of Item 1' instead of 'Menu'.
    There's an example here:
    http://htmldb.oracle.com/pls/otn/f?p=11837:1
    Anyone know why this is happening?
    Thanks for your time.
    John.
    PS. Any idea where my previous post on this subject has disappeared to?

    Carl - in the example on htmldb.oracle.com, in Menu2 I'm hiding all the elements in Category 1 (parent and children), although not the 'grandparent' (Menu2).
    I'm therefore still expecting the menu title to be 'Menu2', because that's Category 2's parent.
    It doesn't appear to be an issue with the sequence of the items, because I've changed all those about and still got the same problem.
    To be more specific, again using the htmldb.oracle.com example, in Menu2 we have:
    Menu2
      Category 1 (Hidden)
        Item 1 of Category 1 (Hidden)
        Item 2 of Category 1 (Hidden)
        Item 3 of Category 1 (Hidden)
        Item 4 of Category 1 (Hidden)
      Category 2     
        Item 1 of Category 2     
        Item 2 of Category 2     
    And Scott - thanks for picking up the previous post - for some reason I couldn't for the life of me find that yesterday (in fact I still can't find it when I search).
    Thanks for looking into this.
    Regards,
    John.

  • When I export an image with a Green label, it exports with a "Green" keyword! How do I prevent this?

    I've added a Green color label to an image. When I export the image as a JPEG and then upload it to Flickr, I find a "Green" keyword that I don't want. How can I turn off this behavior -- i.e., exporting color labels as keywords -- while preserving the ability to export all the keywords I added manually?
    I know the keyword is coming from Lightroom because I temporarily changed the Color label's legend to "GGreen" and the keyword "GGreen" appeared in the Flickr upload dialog.
    I inspected the IPTC data of the exported JPEG image with a 3rd-party program (Irfanview) but could not find "Green" (or "GGreen") in the file, but all my manually-added keywords are there.
    I've tried all of Lightroom's Export dialog Metadata settings.
    Thanks,
    -- Sam

    New information and some screen grabs!
    The new information is that the unwanted label "Green" (or whatever color label is selected) appears as a Flickr Tag only when no manually entered keywords are attached to the image in Lightroom. Adding even one keyword in Lightroom and repeating the export-from-Lightroom-then-upload-to-Flickr process results in no "Green" tag in Flickr.
    The images are a) the Flickr upload screen showing the "Green" tag; b) my Lightroom Metadata presets -- everything unchecked; c) my Lightroom Export dialog panel.

  • To group images with created text frame and apply label for it...

    Hi Everyone,
    We are currently working in auto figure placements for CS3. I have placing the figures into the document. Then i am creating figure caption text frames below the images. Here the concern is i need to group these image and the text box. After this i have to place these images with captions into corresponding pages where the figures have been cited. Also suggest me how to place these images in center of the page as well as in top or bottom of the page margin.
    Can anyone help me for this. Your help will be much appreciated.
    Below is my modified script,
    var myPage;
    main();
    function main(){
        var myFilteredFiles;
        app.scriptPreferences.userInteractionLevel = UserInteractionLevels.interactWithAll;
        myExtensions = [".jpg", ".jpeg", ".eps", ".ps", ".pdf", ".tif", ".tiff", ".gif", ".psd", ".ai"]
        var myFolder = Folder.selectDialog("Select the folder containing the images", "");
        if(myFolder != null){
                if(File.fs == "Macintosh"){
                    myFilteredFiles = myMacOSFileFilter(myFolder);
                else{
                    myFilteredFiles = myWinOSFileFilter(myFolder);
                if(myFilteredFiles.length != 0){
                    for (j=0; j<myFilteredFiles.length; j++){
                        var myImages = myFilteredFiles[j];
                        citePage(j);
                        app.activeDocument.pages.item(myPage.name).place(myImages);
                        alert("Done!");
    function myMacOSFileFilter(myFolder){
        var myFilteredFiles = myFolder.getFiles(myFileFilter);
        return myFilteredFiles;
    function myFileFilter(myFile){
        var myFileType = myFile.type;
        switch (myFileType){
            case "JPEG":
            case "EPSF":
            case "PICT":
            case "TIFF":
            case "8BPS":
            case "GIFf":
            case "PDF ":
                return true;
                break;
            default:
            for(var myCounter = 0; myCounter<myExtensions.length; myCounter++){
                var myExtension = myExtensions[myCounter];    
                if(myFile.name.indexOf(myExtension)>-1){
                    return true;
                    break;           
        return false;   
    //To find cited pages
    function citePage(myInst){
        app.findGrepPreferences = app.changeGrepPreferences = NothingEnum.NOTHING;
        app.findGrepPreferences.findWhat="(?<=Figure \\d\\.)\\d";
        var myFind=app.findGrep(false);
        myPage = myFind[myInst].characters.item(0).parentTextFrames[0].parent;
        return myPage.name;
    Thanks Regards
    Thiyagu

    The shadow effect has to have something to be applied on, but by default text frames borders and fills are invisible.
    If you set the border of your frame to a color & thickness, you'll see it gets a shadow of its own, independent of the text. (Try it with dotted and dashed lines!)
    Additionally, if you set the fill of your text frame to a solid color, you'll see the single solid shadow you were expecting.

  • Centering a Horizontal CSS only, jQuery, or Spry navigation bar within a Div

    Hello all.  I need a solution for centering a horizontal style nav bar whether it be css only, jQuery or Spry based.  I've been trying to use widgets from the adobe widget browser or other ones I've been able to find online.  I have been able to get the graphic that goes behind the links to span the entire width of the Div, but I can't move the actual links to the center of the screen and get it to stay in the middle like the rest of the elements do when you resize the page.  The links always stay anchored to the left side of the page.  I've been able to move them all the way to the right side of the page through a certain css change, but that is not what I'm looking for.  Do I need to resize the Div, or add a div within the div?  Do I need to split the horizontal width of the single div into three div's and put the nav bar into the middle one?  If that is the solution, how do I add the div's next to each other, I tried  adding a div within the div, but nothing really appears to show up, so that must essentially be a wrong way of going about it.
    Well anyways, I need some advice, somebody please lead me in the right direction on how to get this right.  In the div above the one I'm trying to make this happen in, I have a flash object and it just centers itself perfectly with the div and moves with the rest of the page fluidly when you resize.  And the same goes for a div right above that which contains the company logo.
    Thanks for help in advance.

    This is what I mean by the dotted lines not lining up evenly at the ends.
    Here is the source code for the page, followed by the css:
    <!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 name="description" content="Common Wealth Web Solutions: Web Development, Graphic Design, Media Consultant, Community Engagement" />
    <meta name="keywords" content="Common,Wealth,Web,Solution,Design,Graphic,Development,Interactivity,services,fla sh,php,javascript,ajax,professional,Caleb Wright, Peter Wallis,artist,video,multimedia,production,search engine optimization,SEO,video production design" />
    <meta http-equiv="Content-Type" content="text
    /html; charset=UTF-8" />
    <title>Common Wealth Web Solutions: Web Development, Graphic Design, Media Consultation, Community Engagement</title>
    <link href="stylesMain.css" rel="stylesheet" type="text/css" />
    <!--[if lt IE 7]>
    <link rel="stylesheet" type="text/css" href="PNGfix.css" />
    <![endif]-->
    <!--[if lte IE 7]>
    <style type="text/css">
    #hornav ul li { padding: 0 0 0 10px; }
    </style>
    <![endif]-->
    <!--[if lte IE 6]>
    <style type="text/css">
    #wrapper-body, #wrapper-1, #wrapper-2, #wrapper-3 { height: 1%; }
    </style>
    <![endif]-->
    <script type="text/javascript" src="scripts.js"></script>
    <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
    <style type="text/css">
    #apDiv1 {
        position:absolute;
        width:1844px;
        height:43px;
        z-index:1;
        left: 64px;
        top: 253px;
    body {
        background-color: #FFF;
    </style>
    <link href="SpryAssets/SpryAccordion_flexible.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    a:link {
        color: #00F;
    </style>
    <style type="text/css">
    #menu {
    width: 700px;
    margin: 0 auto;
    #menu ul {
    padding: 0;
    margin: 0;
    text-align:center;
    list-style:none
    #menu li{
    padding: 0;
    margin: 0;
    display:inline;
    margin-right: -2px;
    #menu a {
    background-color:#66F;
    padding: 6px 15px;
    color: #fff;
    text-decoration: none;
    #menu a:hover {
    background-color:#39C;
    </style>
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-3119473-5']);
      _gaq.push(['_setDomainName', 'none']);
      _gaq.push(['_setAllowLinker', true]);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script>
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-3119473-6']);
      _gaq.push(['_setDomainName', 'none']);
      _gaq.push(['_setAllowLinker', true]);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script>
    <link href="CSSOnlyMenu4/css/menu4.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    /* BeginOAWidget_Instance_2141545: #OAWidget */
    #menu4 ul {
        font-family: Verdana, Geneva, sans-serif;
        font-size: 30px;
        letter-spacing: -3px;
        border-top:5px dotted #003399;
        border-bottom:5px dotted #003399;
        margin:20px;
    #menu4 ul li a{
        color: #003399;
        padding: 10px 5px 10px 10px;
        width: 170px;
    #menu4 ul li a:hover span.title{
        color:#00adef;
    #menu4 ul li a span.text{
        font-family: Georgia, serif;
        font-size: 13px;
        color:#c7e7f3;
    /* EndOAWidget_Instance_2141545 */
    </style>
    <script type="text/xml">
    <!--
    <oa:widgets>
      <oa:widget wid="2141545" binding="#OAWidget" />
    </oa:widgets>
    -->
    </script>
    </head>
    <body>
    <div id="wrapper-body">
      <div id="wrapper-1">
        <div id="branding">
          <h1>
          <div>
            <p><img src="images/lorentzpaintinglogo_cropped2.png" width="317" height="110" alt="Lorenz Painting Co." longdesc="http://www.lorenzpainting.com" /></p></div>
          <div id="flash">
          <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="700" height="250" id="FlashID" title="Lorenz Painting Co Flash Widget">
            <param name="movie" value="LorentzBanner.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="LorentzBanner.swf" width="700" height="250">
              <!--<![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>
              </div>
              <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
          </object>
          </h1>
    <div>
      <div id="menu4">
        <ul>
          <li><a href=""> <span class="title">Home</span> <span class="text">Why us?</span> </a> </li>
          <li><a href="">Services<span class="text">What we do</span> </a> </li>
          <li><a href=""> <span class="title">Testimonials</span> <span class="text">What they say</span> </a> </li>
          <li><a href=""> <span class="title">Contact</span> <span class="text">How to get in touch</span> </a> </li>
        </ul>
    </div>
    <p> </p>
      <p> </p>
      <p> </p>
    </div>
          <div></div>
        </div>
        <div id="wrapper-2">
          <div id="content-top" class="png"></div>
          <div id="wrapper-3">
            <div id="content-1">
              <div class="content-wrap">
                <p>Home</p>
                <p>Contact</p>
              </div>
            </div>
            <div id="content-2">
              <div class="content-wrap">
    stuff
    <p> </p>
              </div>
            </div>
            <div id="content-bottom"></div>
          </div>
          <div id="footer">
            <p><strong>Lorentz Painting Co., 2011</strong><strong></strong></p>
          </div>
        </div>
      </div>
    </div>
    <script type="text/javascript">
    swfobject.registerObject("FlashID");
    jQuery("#jQueryUIAccordion").accordion({
            event: "click",
            collapsible: false,
            autoHeight: true
    </script>
    </body>
    </html>
    Be forewarned, there are a bunch of rules in here that don't apply to anything anymore, as it's from a recycled rules from another site I built.  Sorry.
    I will first put the CSS for the main style sheet, and I will put the CSS for the Horizontal Nav Bar in after.
    CSS:
    Main style sheet:
    @charset "UTF-8";
    body
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 1.2em;
        color: #6B6B6B;
        background: #8D927C url(images/bg_body.jpg) repeat-x;
        margin: 0;
        padding: 0;
        min-width: 800px;
        text-align: center;
        background-color: #000;
    h2, h3, h4
        font-size: 16pt;
        font-weight: normal;
        margin: 15px 0 0 0;
    #wrapper-3 p
        padding: 0;
        line-height: 1.35em;
        margin-top: 8px;
        margin-right: 0;
        margin-bottom: 8px;
        margin-left: 0;
    #wrapper-3 ul
        list-style-type: none;
        margin: 8px 0;
        padding: 0;
    #branding
        margin: 0 0 0 0;
    @Generic anchor (link) styles
    a:link, a:visited
        color: #4f4f3f;
    a:hover, a:active
        color: #000000;
    @Inline image styles
    img.float-left
        float: left;
        margin: 0 6px 6px 0;
    img.float-right
        float: right;
        margin: 0 0 6px 6px;
    img.border
        background: #FFF;
        padding: 2px;
        border: 1px solid #999;
    @Tab navbar styles
    #hornav ul
        margin: 0;
        list-style-type: none;
        line-height: normal;
        padding: 0;
        text-align: center;
        margin-bottom: 60px;
        font-size: 0.8em;
        text-transform: uppercase;
    #hornav ul li
        display: inline;
        margin: 0 2px 0 0;
        padding: 3px 0 3px 10px;
    #wrapper-body #wrapper-1 #hornav ul li a br {
        height: 400px;
    #hornav ul li a
        text-decoration: none;
        margin: 0;
        background-repeat: inherit;
        background-position: center center;
        padding-top: 50%;
        padding-right: 10px;
        padding-bottom: 3px;
        padding-left: 10px;
    #hornav ul li a:link, #hornav ul li a:visited
        color: #3e3f2f;
    #hornav ul li a:hover, #hornav ul li a:active
        color: #000000;
    @Secondary navigation styles
    #navcontainer
        background: transparent url(images/bg_navlist-top.jpg) no-repeat top center;
        margin: 0;
        padding: 12px 0 0 0;
    #navcontainer ul
        margin: 0;
        list-style-type: none;
        line-height: normal;
        padding: 0 0 12px 0;
        border-top: 1px solid #FFF;
        background: transparent url(images/bg_navlist-bottom.jpg) no-repeat bottom center;
    #navcontainer a
        display: block;
        padding: 3px 6px;
        width: 168px;
        margin: 0 10px;
        background-color: #c4bfac;
        border-bottom: 1px solid #FFF;
    #navcontainer a:link, #navlist a:visited
        color: #FFF;
        text-decoration: none;
    #navcontainer a:hover
        background-color: #90937e;
        color: #FFF;
    @Masthead text styles
    #branding
        margin: 0;
        padding: 0;
    #branding h1
        color: #000;
        padding: 10px 0 0px 0;
        border-top: 4px solid #656e5d;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 0.3em;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 28px;
        font-style: normal;
        line-height: normal;
        font-weight: normal;
        font-variant: normal;
        margin: 0;
    @Layout styles
    #wrapper-body
        background: transparent url(images/bg_wrapper-body.jpg) no-repeat top right;
        width: inherit;
        margin: 0;
        padding: 0;
    #wrapper-1
        width: auto;
        background: transparent url(images/bg_wrapper-1.jpg) no-repeat;
        margin: 0;
        padding: 0;
    #wrapper-2
        width: 45em;
        text-align: center;
        margin-top: 0;
        margin-right: auto;
        margin-bottom: 0;
        margin-left: auto;
    #wrapper-3
        background: url(images/bg_wrapper-3.jpg) repeat-y;
        color: #333;
        text-align: left;
    #content-top
        margin: 0;
        height: 1em;
        background: url(images/bg_content-top.jpg) no-repeat;
        font-size: 0;
        line-height: 0;
    #content-1
        float: left;
        width: 12em;
        font-size: 0.9em;
        padding: 0;
        margin-top: 2em;
        margin-right: 2em;
        margin-bottom: 0em;
        margin-left: 0em;
    #content-2
        float: left;
        width: 40em;
        padding: 0;
        font-size: 0.8em;
        margin-top: 2em;
        margin-right: 0px;
        margin-bottom: 0em;
        margin-left: 0em;
    #content-3
        float: left;
        width: 250px;
        font-size: 10pt;
        margin: 0;
        padding: 0;
    #content-4 {
        width: 190px;
        padding: 0px;
        line-height: 0px;
    #content-bottom
        clear: both;
        height: 1em;
        background: url(images/bg_content-bottom.jpg) no-repeat;
        font-size: 0;
        line-height: 0;
    .content-wrap
        margin: 0;
        padding-top: 0px;
        padding-right: 2em;
        padding-bottom: 5px;
        padding-left: 0px;
    #footer p
        font-size: .75em;
        margin: 12px 0;
    p.content-wrap {
        font-size: 9pt;
        color: #999;
    @Blog post styles
    .date
        float: left;
        height: 52px;
        width: 52px;
        background: url(images/date.png) no-repeat;
        margin-right: 10px;
        padding-top: 0px;
        line-height: normal;
    .date .month
        display: block;
        text-align: center;
        color: #FFF;
        font-size: 11px;
        padding-top: 4px;
        text-transform: uppercase;
    .date .day
        display: block;
        text-align: center;
        padding-top: 5px;
        color: #222;
        font-size: 18px;
        font-weight: bold;
    .meta
        display: block;
        font-size: 11px;
        color: #666;
        clear: right;
    .blog-entry
        clear: both;
        padding-top: 2px;
    #searchform
        margin: 8px 0;
        padding: 0;
    @Search form styles
    #searchform fieldset
        margin: 0;
        padding: 0;
        border: 0;
    #searchform label
        color: #999;
        display: none;
    #searchform input
        width: 160px;
        color: #222;
    #searchform #submitquery
        display: none;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap p {
        line-height: 1.35em;
        text-align: justify;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-1 .content-wrap #Accordion1 .AccordionPanel.AccordionPanelOpen .AccordionPanelContent p {
        line-height: 1em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us #sprytextarea1 span .content-wrap {
        font-size: .5em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us #website {
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us #website {
        display: none;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us #website label {
        display: none;
    #website {
        display: none;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us fieldset legend {
        font-size: 1.1em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us fieldset legend {
        font-size: 1.1em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us fieldset legend {
        font-size: 4em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us fieldset .AccordionPanelContent {
        font-size: 1em;
    #wrapper-body #wrapper-1 #wrapper-2 #wrapper-3 #content-2 .content-wrap #Contact Us fieldset .AccordionPanelContent {
        font-size: 3em;
    .fieldname {
        font-size: .9em;
    CSS for Horizontal Nav Bar:
    #menu4 {
        width: 829px;
        margin: 0 auto 0 auto;
    #menu4 ul {
        list-style:none;
        font-family: Helvetica, Arial, sans-serif;
        font-size: 30px;
        letter-spacing: -3px;
        line-height: 1.2em;
        border-top:5px dotted #c7e7f3;
        border-bottom:5px dotted #c7e7f3;
        float:left;
        clear:both;
        margin:20px;
        text-align:center
    #menu4 ul li{
        float:left;
    #menu4 ul li a{
        display:block;
        text-decoration:none;
        padding:10px 10px 5px 10px;
        color:#66b8d8;
        width:170px;
    #menu4 ul li a span{
        display:block;
    #menu4 ul li a span.title{
    #menu4 ul li a:hover span.title{
        color:#00adef;
    #menu4 ul li a span.text{
        padding:0px 5px;
        font-family: Georgia, serif;
        font-size: 13px;
        font-style: italic;
        font-weight: normal;
        letter-spacing: normal;
        line-height: 1.6em;
        color:#c7e7f3;
        visibility:hidden;
    #menu4 ul li a:hover span.text{
        visibility:visible;
    Thanks!

  • When I upload photos from my Canon Rebel 1000D to iphoto the images are labelled JPEG, yet I shoot in RAW.How do I get iphoto 11 vers9.1.3 to not convert the photos to jpeg.

    HI,
    When I upload photos from my Canon Rebel 1000D to iphoto the images are labelled JPEG, yet I shoot in RAW.How do I get iphoto 11 vers9.1.3 to not convert the photos to jpeg. I seem to have tried and read so much but just can't figure it out.  How do I get iphoto 11 vers9.1.3 to not convert the photos to jpeg. Or do a have to use a different system? I have Adobe Bridge. Or can I upload directly into photoshop?
    Also how do you install dmg's properly I am having problems installing them?
    I have a Mac OS X 13 inch Version 10.6.7
    Advice desperately needed
    Thanks
    Nlouis

    Do you have Aperture installed? I found your model on a compatibility list; however, there was a note that it requires Aperture 2 to be installed:
    http://www.apple.com/aperture/specs/raw.html
    According to this excerpt:
    To see a list of digital cameras with RAW-format support that are compatible with iPhoto, visit this Aperture webpage (any camera compatible with Aperture, Apple’s advanced photo editing and management program, is compatible with iPhoto as well)
    which is at the bottom of this page:
    http://docs.info.apple.com/article.html?path=iPhoto/9.0/en/pht41627265.html
    I may be wrong, but I interpret that info to mean you need Aperture 2 before iPhoto will work with RAW?

  • Set a default value for a radio button populated with a List of value

    Hi,
    I am using jdeveloper 11.1.1.3.0. I need to set a default value for a radio button populated with a List of value(Yes/No). Here's the selectonechoice code.
    <af:selectOneRadio value="#{bindings.Code.inputValue}"
    label="#{bindings.Code.label}"
    required="#{bindings.Code.hints.mandatory}"
    shortDesc="#{bindings.Code.hints.tooltip}"
    id="sor1" autoSubmit="true"
    valuePassThru="true" layout="horizontal">
    <f:selectItems value="#{bindings.Code.items}" id="si1"/>
    </af:selectOneRadio>
    I want to have the selectonechoice set to No by default. In the previous versions, I set the default value in the base attribute VO. But it is not working in the new version.
    Thanks

    Hi,
    this should work in JDeveloper 11.1.1.3 the same as in 11.1.1.2. If it doesn't then it is better to file a bug than to work around it
    Frank

  • Missing "Charts, Images, Text Labels" demo from iWorks Numbers page.

    Really just an issue with the number iWorks page on the website.
    At the address below, Apple has a few watchable demos:
    http://www.apple.com/iwork/numbers/
    Intelligent Tables.
    Flexible Canvas.
    Charts, Images, Text Labels.
    and
    Interactive Print View.
    But the hyperlink listed under "Charts, Images, Text Labels." is the same as the one under "Flexible Canvas."
    Does anyone have the actual address that takes you to the "Charts, Images, Text Labels." demo?
    for reference, here is the address that is duplicated:
    http://movies.apple.com/movies/us/apple/mac/iwork/2007/features/iworkfeatures_flexiblemediarichcanvas_20070807640x400.mov
    thanks!

    The link below is now available from the iworks page:
    http://movies.apple.com/movies/us/apple/mac/iwork/2007/features/iworkfeatures_2dand3dcharts_20070807640x400.mov
    Thanks to who ever updated it.

Maybe you are looking for

  • CPU always at highest speed after 10.4.8 update

    Does anyone else have same kind of "problems" than I have after todays OS X update? Before the update CoreduoTemp showed that CPU speed was moving from 1GHz to maximum 2GHz. Usually it was 1.5GHz and only in hevy load it was maximum. Now when running

  • BAPI_ACC_PURCHASE_ORDER_CHECK

    Hi, How can the bapi BAPI_ACC_PURCHASE_ORDER_CHECK can help to check if funds reservation data (earmarked fund) from a purchase order item, can be posted. Thanks, Eyal.

  • What is the best resolution for E540 Edge?

    Hi ! Someone can tell me what is the best resolution for E540 windows 7? (The recomended is 1920x1080, But I don't like it...). any recommendations? Thanks

  • I can't get launchctl to run a simple script

    I've written the following bash script (saved to /usr/local/bin/adwidget.fiveminutes.sh): #!/bin/sh /usr/bin/curl -o /tmp/fiveminutes.php http://adwidget.local/every/fiveminutes.php (adwidget.local is a vhost pointed to my local Apache/PHP server on

  • Pal/NTSC Convertion

    Hi There! Need a bit of help. I take it all back! The Compressor does a splendid job of converting Pal/NTSC as long as one does not want to watch it on an LCD Screen. Looks wonderful, well more than acceptable, on an ordinary NTSC TV and on a compute