[ANN] How to vertically/horizontally center thumbnails

http://www.tjkdesign.com/articles/thumbnail_and_caption/inline-block_-moz-inline-box_and_z oom.asp
Thierry
Articles and Tutorials:
http://www.TJKDesign.com/go/?0
Keep your markup *clean* with these DW extensions and
scripts:
http://www.divahtml.com/products/scripts_dreamweaver_extensions.php

"djinn" <[email protected]> wrote in
message
news:g2bls3$h4o$[email protected]..
> Thierry wrote:
>>
http://www.tjkdesign.com/articles/thumbnail_and_caption/inline-block_-moz-inline-box_and_z oom.asp
>
> tres bon - mon ami ;-)
Merci Sinclair
PS: don't be silly, reviens ;-)
Thierry
Articles and Tutorials:
http://www.TJKDesign.com/go/?0
Keep your markup *clean* with these DW extensions and
scripts:
http://www.divahtml.com/products/scripts_dreamweaver_extensions.php

Similar Messages

  • TS3274 How do I lock and unlock the vertical/horizontal screen positions?

    How do I lock and unlock the vertical/horizontal screen positions?

    Use the Side Switch or Rotation Lock in Control Center.

  • How to vertically center InlineGraphicElements?

    Hi all,
    I'm trying to extend the InlineGraphic TLF example to insert images of varying sizes, but vertically center them in the text Flow.  I'm having trouble figuring out the correct parameters to properly center the element.  I've been playing with alignmentBaseline & dominantBaseline w/ IDEOGRAPHIC_CENTER, but I don't get very promising results.  Here's a screen shot of where I'm at:
    Notice the blue box(added in post), the text MESSUP is being placed on the same line as the Lorem Ipsum text(in the string, it's Donec MESSUP).  Also, the selection box (Ctrl+A) shows breaks in the text layout.  It seems like the boxes should be shifted up.  This may be as designed, if so, how do I compact/shift the boxes up?
    For contrast, this is what it looks like without the centering:
    Source:
    package
        import flash.display.Sprite;
        import flash.text.engine.TextBaseline;
        import flashx.textLayout.container.ContainerController;
        import flashx.textLayout.edit.EditManager;
        import flashx.textLayout.elements.InlineGraphicElement;
        import flashx.textLayout.elements.InlineGraphicElementStatus;
        import flashx.textLayout.elements.ParagraphElement;
        import flashx.textLayout.elements.SpanElement;
        import flashx.textLayout.elements.TextFlow;
        import flashx.textLayout.events.StatusChangeEvent;
        import flashx.undo.UndoManager;
        [SWF(width="760", height="590", backgroundColor="0xCCCCCC", frameRate="30")]
        public class inliner extends Sprite
            protected var textFlow:TextFlow;
            public function inliner():void
                var elements:Array =
                    "Lorem ipsum dolor", null,
                    "sit amet, consectetur", null,
                    "adipiscing elit. Mauris eu odio nibh. Duis", null,
                    "scelerisque mattis risus, vitae viverra", null,
                    "ipsum vehicula non.", null,
                    "Donec MESSUP"];
                textFlow = new TextFlow();
                textFlow.fontSize = 34;
                textFlow.backgroundColor = 0xFFFFFF;
                textFlow.backgroundAlpha = 1;
                var imageSize:uint = 20;
                var paragraphElement:ParagraphElement = new ParagraphElement();
                textFlow.addChild(paragraphElement);
                for(var i:uint = 0; i < elements.length; ++i)
                    var obj:* = elements[i];
                    if(obj is String)
                        var string:String = obj as String;
                        var span:SpanElement = new SpanElement();
                        span.text = string;
                        paragraphElement.addChild(span);
                    else if(obj == null)
                        var inlineGraphic:InlineGraphicElement = new InlineGraphicElement();
                        inlineGraphic.width = imageSize;
                        inlineGraphic.height = imageSize;
                        imageSize += 20;
                        inlineGraphic.source = "http://www.adobe.com/shockwave/download/images/flashplayer_100x100.jpg";
                        // comment out to change back to good looking text
                        inlineGraphic.alignmentBaseline = TextBaseline.IDEOGRAPHIC_CENTER;
                        inlineGraphic.dominantBaseline = TextBaseline.IDEOGRAPHIC_CENTER;                   
                        paragraphElement.addChild(inlineGraphic);
                // event sent when graphic is done loading
                textFlow.addEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE, graphicStatusChangeEvent);
                const bufferX:Number = 50;
                var sprite:Sprite = new Sprite;
                sprite.x += bufferX;
                addChild(sprite);
                textFlow.flowComposer.addController(new ContainerController(sprite, 760 - bufferX * 2, 590));
                // this call compose but the graphic hasn't been loaded from the source URL yet.
                // The actualWidth and actualHeight are zero. 
                refresh();
                var em:EditManager = new EditManager(new UndoManager);
                textFlow.interactionManager = em;
                textFlow.interactionManager.setFocus();
            protected function graphicStatusChangeEvent(e:StatusChangeEvent):void
                // if the graphic has loaded update the display
                // actualWidth and actualHeight are computed from the graphic's height
                if(e.status == InlineGraphicElementStatus.READY || e.status == InlineGraphicElementStatus.SIZE_PENDING)
                    refresh();
            protected function refresh():void
                textFlow.flowComposer.updateAllControllers();

    Cannot, really.
    Read this -
    http://www.apptools.com/examples/tableheight.php
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "Reese" <[email protected]> wrote in message
    news:eh34gg$rvh$[email protected]..
    > How to vertically center a div? :-S
    >

  • How to display horizontally to vertically column in oracle

    Dear All
    How to display horizontally to vertically column in oracle,Please give me Sol. ASAP

    Sunil,
    Which column is the sal column? I can’t see any numeric columns in your query. If you use htmldb_item calls in your query column, then this makes them strings and you can’t build sums on string columns. If you want to build sums in an updateable report / tabular form, then don’t use the htmldb_item API. Instead use the built-in display types on the report column attributes page. Using the built-in display types is the better options in most cases anyway and they do allow you to calculate sums even if the column is a text field or display and save type field.
    Regards,
    Marc

  • - How to vertically center a div?

    How to vertically center a div? :-S

    Cannot, really.
    Read this -
    http://www.apptools.com/examples/tableheight.php
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "Reese" <[email protected]> wrote in message
    news:eh34gg$rvh$[email protected]..
    > How to vertically center a div? :-S
    >

  • Align Center Horizontal & Center Vertical Backwards

    Align "center horizontal" centers vertically and "center vertical" works horizontally in CS5.  Is this an undocumented feature????

    I am using the dropdown "Modify" then"Align".

  • How to make Canvas on a JSCrollPane Vertical/Horizontal splittable

    I have a JScrollPane on which i placed a JTree(Vertical/Horizontal Scrollable)
    I have a ScrollPane on which i placed a Canvas(Vertical/Horizontal Scrollable)
    I was able to do it but, its splitting towards the JScrollPane area only.
    So i tried to make a JScrollPane and tried to add a Canvas to it setting the options as JScrollPane.VERTICAL_SCROLLBAR_ALWAYS, JScrollPane.HORIZONTAL_SCROLLBAR_ALWAYS.
    But the problem is its showing the Scrollable bars but not able to Scroll when more images are there on the Canvas.
    My problem will be solved if i was able to add a Canvas to the JScrollPane with Vertical/Horizontal Scrollable.

    Don't mix Swing and AWT components. Don't use a Canvas. Use a JPanel instead.
    If you need further help then you need to create a [url http://homepage1.nifty.com/algafield/sscce.html]Short, Self Contained, Compilable and Executable, Example Program that demonstrates the incorrect behaviour, because I can't guess exactly what you are doing based on the information provided.
    And don't forget to use the [url http://forum.java.sun.com/help.jspa?sec=formatting]Code Formatting Tags so the code retains its original formatting.

  • "Vertical Align Center" Text and a Shape

    Hi designers,
    I wonder if anyone could give me a hand with aligning text and shapes? I would like to align a number to the center of a circle. "Horizontal Align Center" works well. "Vertical Align Center", however, does not yield the desired result. The number turns out to be higher in the cycle (see figure below). The distance from the top of the circle to the top of the number zero, X, is shorter than the distance between the bottom of the circle and the bottom of the number zero. Is it possible to equal these two distances?
    Figure 1: The Outcome of Vertical Align Center
    Thanks,
    Haobo

    Hi Mylenium,
    Thank you very much for you very prompt reply, which solves the problem very effectively.
    If you do not mind, I have got two further questions.
    Firstly, is there an option similar to "Align to Path: Centre" under "Type on a Path Options" that changes how text is aligned?
    Secondly, does InDesign offer the aforementioned function?
    I sometimes label a large quantity of locations with alphanumeric characters, which are subject to frequent changes, and therefore would like to preserve the text if possible. I have heard that manipulating text is InDesign's area of expertise. If this function is not available in Illustrator but offered by InDesign, I can jot down another reason for acquiring the latter and split the workflow in the future.
    Thanks,
    Haobo

  • Photoshop Elements 7 - How do I align/center a layer?

    I'm using Photoshop Elements 7. How do I align/center a layer vertically or horizontally on a page?

    Are you adding objects to a blank layer? If so bring up the ruler then drag and drop guides to your center and any additional points. You can also set so that objects automatically snap to the guide lines.
    If you want to align visually similar images on top of each other, there is no auto-align like in CS5. The only work around is to lower the opacity of the top layer and then use the move tool to align by eye.
     

  • Horizontal Scrolling Thumbnails Slideshow (Are these possible in Muse CC 2014)

    Good afternoon Muse Forum: My name is Ira Bitner from NYC U.S.A.
    How are you? I have a question regarding slideshow and thumbnails in MUSE CC 2014.
    Q: In Muse is it possible to have a Slideshow with Scrolling Horizontal Thumbnails? In other words is it possible to build a slideshow where, for instance, maybe 30 thumbnails are used but only 5 or so are visible in a horizontal row under the main ("hero" image) and when an arrow is clicked the thumbnails advance horizontally to the left bringing up the new group of thumbnails that were, "hidden" on the original horizontal row? This allows the site to contain many more thumbnails than can "fit" on the page and at the same time not cause the extra thumbnails to be made to be stacked vertically all on the same page seen all at once?
    This is a very popular way to show a slideshow that advances the images. I have spent all night and hours and hours researching Muse in the forums, videos, tutorials web-wide and have not been able to find a way to achieve this kind of slideshow. I would have thought the actual slideshow widget would have made it very  evident if this was actually possible to build in Muse. Please help. If you need any website link as an example of the slideshow advancing thumbnail horizontally I'll add one, but it is very common and I can't believe Muse would not allow this to be built.

    Replied here :
    Muse CC 2014 Slideshow Horizontal Scrolling Thumbnails (Possible?)

  • How do I type [cent]?

    How do I type [cent], or a "c" with a nearly-vertical segment through the c?  [I _miss_ Key Caps, OK?]  Thank you.  :-)

    ¢ = Opt + 4 ($)
    Sounds like new accounting to me...

  • How do I set the thumbnail image of my videos that export to my computer?  I'm using Premiere Elements 11 on a windows 8.1 PC 64bit.

    How do I set the thumbnail image of my videos that export to my computer?  I'm using Premiere Elements 11 on a windows 8.1 PC 64bit.
    Or how does Premiere 11 determine where to set the image for the video it is exporting? 
    I already know how to use Freeze frame and save the image to my computer by Publish+Share/Computer/ Immage.
    Thanks,
    Mike

    Mike
    This is not Adobe. Rather user to user. We are all visitors here.
    Just a bit of history....back in the days of Premiere Elements 4, you could set a "poster frame" in what was called the Project area. You did this by right clicking a blank area there and, from the drop down menu that appeared, selecting View/Preview Area, and using the poster frame feature there.
    As I said, when a video imports into Premiere Elements, the thumbnail of the import has been presenting as the first frame of the video. With this Preview area "poster frame" option, you could set the video's thumbnail in the Project area so that the first frame was another frame in the video. But, this "perk" was restricted to thumbnails of the video in Project area.
    If you exported to file with the first frame modified video, the export's thumbnail in Windows Explorer would present with other than the real first frame or the poster frame as the first frame.
    Also, in more recent versions, I have observed that the export to file does not display the real first frame of the video in Windows Explorer. Seems random, but I have not kept track.
    And, remember, at the onset I wrote
    As far as I have ever seen, Premiere Elements Windows uses the first frame of the video for its thumbnail in the program.
    I know of no way within Premiere Elements to control what the program opts to do in this matter. In some compatibility
    issues, it opts to give no image but a generic one.
    I did not say that you can expect to have the Premiere Elements' export file's thumbnail in Windows displaying with its real first frame. And, the more you get into this, depending on the versions, more details need to be added to my comment about "...first frame of video for its thumbnail in the program..."
    I would have to look into all this further to get perspective on the contributing factors.
    ATR
    Add On...The Poster Frame feature appeared in versions 4, 7, 8, and 9 by my count.

  • How can I update the thumbnails in the slide panel when a slide has been changed?

    When the text in a slide has been changed, how can you update the thumbnail in the slide panel to reflect this change?
    We translated slides, but the slides in the slide panel are still in English.
    Thanks for your help.

    the slides should update automatically as you type
    are you using a  theme you created yourself, or one you have added for this show?
    when you play the show, does the slides show correctly?  If they are OK you could still show the presentation.
    also what Mac are you using and what graphic crd is installed?

  • How to draw horizontal line in smartform after end of the all line items

    Hi Friends,
    I am working on the smartform. I have created TABLE node in Main window.
    i want to draw a horizontal line after end of the main window table node. i mean after printing all the line items of the table, I need to print one horizontal line.
    Could you please help me how to resolve this issue.
    FYI: I tried with the below two options. But no use.
    1. desinged footer area in the table node of the main window.
    2. tried with uline and system symbols.
    please correct me if i am wrong. please explain in detail how to draw horizontal line after end of the main window table.
    this is very urgent.
    Thanks in advance
    Regards
    Raghu

    Hello Valter Oliveira,
    Thanks for your answer. But I need some more detail about blank line text. i.e thrid point.
    Could you please tell me how to insert blank line text.
    1 - in your table, create a line type with only one column, with the same width of the table
    2 - in table painter, create a line under the line type
    3 - insert a blank line text in the footer section with the line type you have created.

  • How to display horizontal line in top-of-page by using object oriented ALV?

    How to display horizontal line in top-of-page by using object oriented ALV.
    I am created top-of-page in object oriented alv.
    But not be successes in showing horizontal line in it.
    Can any one pls give solution for this..
    Thanks and regards..

    Hi
    Try like this
    data: gt_list_top_of_page type slis_t_listheader. " Top of page text. 
    Initialization. 
    perform comment_build using gt_list_top_of_page[]. 
    form top_of_page. 
    * Note to self: the gif must be loaded into transaction OAOR with 
    * classname 'PICTURES' AND TYPE 'OT' to work with ALV GRID Functions. 
    * I Loaded NOVALOGO2 into system. 
    call function 'REUSE_ALV_COMMENTARY_WRITE' 
         exporting 
    * I_LOGO = 'NOVALOGO2' 
    * i_logo = 'ENJOYSAP_LOGO' 
             it_list_commentary = gt_list_top_of_page. 
    endform. " TOP_OF_PAGE 
    form comment_build using e04_lt_top_of_page type slis_t_listheader. 
    data: ls_line type slis_listheader. 
          clear ls_line. 
          ls_line-typ = 'A'. 
          ls_line-info = 'Special'(001). 
          fgrant = xgrant. 
          concatenate ls_line-info fgrant 
          'Stock Option Report to the board'(002) 
                 into ls_line-info separated by space. 
                        condense ls_line-info. 
          append ls_line to e04_lt_top_of_page. 
    endform. " COMMENT_BUILD
    Use following syntex for footer print in alv:
    * For End of Page
    form END_OF_PAGE.
      data: listwidth type i,
            ld_pagepos(10) type c,
            ld_page(10)    type c.
      write: sy-uline(50).
      skip.
      write:/40 'Page:', sy-pagno .
    endform.
    *  For End of Report
    form END_OF_LIST.
      data: listwidth type i,
            ld_pagepos(10) type c,
            ld_page(10)    type c.
      skip.
      write:/40 'Page:', sy-pagno .
    endform.
    check this link
    http://abapprogramming.blogspot.com/
    https://www.sdn.sap.com/irj/servlet/prt/portal/prtroot/docs/library/uuid/5dc3e690-0201-0010-1ebf-b85b3bed962d
    Changing width of a custom container dynamically
    Display Page numbers in ALV
    Insert picture in selection screen.
    Logo in OO ALV Grid
    Reward all helpfull answers
    Regards
    Pavan

Maybe you are looking for

  • Order status no longer shows any items

    The order status area of my account no longer shows any items even going back 18 months. I've placed about 6 orders in that time frame including one last week. I followed the link to Pre-sign for the shipment but the order never appears, even after 5

  • Standard or Enterprise

    My company is thinking about upgrading to CF7 or 8 when it comes out and I'm trying to figure out the difference between standard and enterprise. The feature list is here: http://www.adobe.com/products/coldfusion/productinfo/product_editions/ but mos

  • Since installing lion my iMac and powebook can't find my printer

    since installing lion my iMac and macbook pro can't find my printer (it is on the supported devices list and I downloaded the latest drivers). I called canon and they stepped me through reseting my print system and reinstalling the print drivers and

  • Item category TA YTAK cannot be invoiced with billing type F2

    Hi Experts, Error message in creating billing I did not make shipment and directly make delivery PGI This is transportation relevance showing in delivery. Is this reason preventing from creating F2 blling type? I am getting error for item category YT

  • SRM-SUS for Service Entry Sheets - Classic Scenario

    Hi SRM Gurus, Our client wants to use SRM-SUS for the Service Entry Sheets (to being with and then later expand more in other SRM areas). The lead system will be R/3 system. We will be going with ECC 6.0 and SRM 5.0. Service Order will be created in