Image through text

Hello
I'm new in Illustrator and would like to know how I could make an image appear in a text
I think the image should be used as background, the text as foreground and i should "make a hole" from the text to see the image through it
But, <I don't find the right way !
Thanks

If I read you correctly what you want to do is make a layer mask. So that any image or art place under the mask on that layer will be masked by the text
and that you can easily move the underlying art as well as the mask independently or together as you wish.
simply create some text then select the by selecting the text and at the bottom of the layers panel click the layer mask icon and there you are.
But to be honest with you there are reasons you would want the mask to apply to the layer and reasons you would want it to  be a clipping mask or an opacity mask
An opacity mask I think is not necessary for what you want in this case as it is tied to what ever it masks.
There is no need to vectorize the text in any of the cases that Jacob discribed. Nor with a layer mask.

Similar Messages

  • Outline of image through text?

    Hello All
    I first created a layer of my background pattern. Then i created a second layer of text, put this second layer below the first one and then with Alt key pressed i clicked the line between the two layers, so that my new composition shows up through only my text.
    But i also want to add an outline to this text, which i am not able to do.
    Please Help me..!!!

    Make sure you have the text layer selected (highlighted) in the layers pallet.
    On the top menu click Layer à Layer Style à Style Settings
    Use stroke and set a color, then click OK.

  • Getting error while updating property of image through weblogic CMS

    Hii
    I want to add alt text and alt title to an existing image through Weblogic Content Management System_ . For that I have used adAltText property of ad content type.
    For that I have refer the following link
    [ http://docs.oracle.com/cd/E13155_01/wlp/docs103/cm/contentTypesCm.html#wp1096390]
    I add values to adAltText. After that clicked on cheach in.
    But while doing cheach in in Weblogic Content Management System_ . I am getting following Exception
    A RepositoryException was thrown: null
    and following is stacktrace:
    com.bea.content.virtual.workflow.WorkflowException
         at com.bea.content.virtual.workflow.PublishAction.execute(PublishAction.java:179)
         at com.bea.content.virtual.internal.server.bean.InternalWorkspaceOpsBean.handleWorkflowActions(InternalWorkspaceOpsBean.java:524)
         at com.bea.content.virtual.internal.server.bean.InternalWorkspaceOpsBean.internalCheckIn(InternalWorkspaceOpsBean.java:420)
         at com.bea.content.virtual.internal.server.bean.InternalWorkspaceOpsBean.checkIn(InternalWorkspaceOpsBean.java:343)
         at com.bea.content.virtual.internal.server.bean.WorkspaceOps_xe5vix_ELOImpl.checkIn(WorkspaceOps_xe5vix_ELOImpl.java:166)
         at com.bea.content.virtual.internal.WorkspaceOpsImpl.checkIn(WorkspaceOpsImpl.java:90)
         at com.bea.content.federated.internal.VersionManagerImpl.checkIn(VersionManagerImpl.java:239)
         at com.bea.portal.tools.content.controls.ContentVersionControlImpl.checkIn(ContentVersionControlImpl.java:165)
         at com.bea.portal.tools.content.controls.ContentVersionControlBean.checkIn(ContentVersionControlBean.java:839)
         at content.BaseContent.doCheckinLatestVersion(BaseContent.java:1127)
         at content.BaseContent.handleLibraryOpForSelectedNode(BaseContent.java:1050)
         at content.node.nodeSelected.properties.NodePropertiesController.checkInLatestVersion(NodePropertiesController.java:530)
         at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
         at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
         at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
         at java.lang.reflect.Method.invoke(Method.java:597)
         at org.apache.beehive.netui.pageflow.FlowController.invokeActionMethod(FlowController.java:879)
         at org.apache.beehive.netui.pageflow.FlowController.getActionMethodForward(FlowController.java:809)
         at org.apache.beehive.netui.pageflow.FlowController.internalExecute(FlowController.java:478)
         at org.apache.beehive.netui.pageflow.PageFlowController.internalExecute(PageFlowController.java:306)
         at global.internal.AbstractBaseController.internalExecute(AbstractBaseController.java:360)
         at org.apache.beehive.netui.pageflow.FlowController.execute(FlowController.java:336)
         at org.apache.beehive.netui.pageflow.internal.FlowControllerAction.execute(FlowControllerAction.java:52)
         at org.apache.struts.action.RequestProcessor.processActionPerform(RequestProcessor.java:431)
         at org.apache.beehive.netui.pageflow.PageFlowRequestProcessor.access$201(PageFlowRequestProcessor.java:97)
         at org.apache.beehive.netui.pageflow.PageFlowRequestProcessor$ActionRunner.execute(PageFlowRequestProcessor.java:2044)
         at org.apache.beehive.netui.pageflow.interceptor.action.internal.ActionInterceptors.wrapAction(ActionInterceptors.java:91)
         at org.apache.beehive.netui.pageflow.PageFlowRequestProcessor.processActionPerform(PageFlowRequestProcessor.java:2116)
         at org.apache.struts.action.RequestProcessor.process(RequestProcessor.java:236)
         at org.apache.beehive.netui.pageflow.PageFlowRequestProcessor.processInternal(PageFlowRequestProcessor.java:556)
         at org.apache.beehive.netui.pageflow.PageFlowRequestProcessor.process(PageFlowRequestProcessor.java:853)
         at org.apache.beehive.netui.pageflow.AutoRegisterActionServlet.process(AutoRegisterActionServlet.java:631)
         at org.apache.beehive.netui.pageflow.PageFlowActionServlet.process(PageFlowActionServlet.java:158)
         at org.apache.struts.action.ActionServlet.doGet(ActionServlet.java:414)
         at org.apache.beehive.netui.pageflow.PageFlowUtils.strutsLookup(PageFlowUtils.java:1199)
         at org.apache.beehive.netui.pageflow.PageFlowUtils.strutsLookup(PageFlowUtils.java:1129)
         at com.bea.portlet.adapter.scopedcontent.ScopedContentCommonSupport.executeAction(ScopedContentCommonSupport.java:687)
         at com.bea.portlet.adapter.scopedcontent.ScopedContentCommonSupport.processActionInternal(ScopedContentCommonSupport.java:142)
         at com.bea.portlet.adapter.scopedcontent.PageFlowStubImpl.processAction(PageFlowStubImpl.java:107)
         at com.bea.portlet.adapter.NetuiActionHandler.raiseScopedAction(NetuiActionHandler.java:111)
         at com.bea.netuix.servlets.controls.content.NetuiContent.raiseScopedAction(NetuiContent.java:181)
         at com.bea.netuix.servlets.controls.content.NetuiContent.raiseScopedAction(NetuiContent.java:167)
         at com.bea.netuix.servlets.controls.content.NetuiContent.handlePostbackData(NetuiContent.java:225)
         at com.bea.netuix.nf.ControlLifecycle$2.visit(ControlLifecycle.java:180)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:324)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walkRecursive(ControlTreeWalker.java:334)
         at com.bea.netuix.nf.ControlTreeWalker.walk(ControlTreeWalker.java:130)
         at com.bea.netuix.nf.Lifecycle.processLifecycles(Lifecycle.java:395)
         at com.bea.netuix.nf.Lifecycle.processLifecycles(Lifecycle.java:361)
         at com.bea.netuix.nf.Lifecycle.processLifecycles(Lifecycle.java:352)
         at com.bea.netuix.nf.Lifecycle.runInbound(Lifecycle.java:184)
         at com.bea.netuix.nf.Lifecycle.run(Lifecycle.java:159)
         at com.bea.netuix.servlets.manager.UIServlet.runLifecycle(UIServlet.java:388)
         at com.bea.netuix.servlets.manager.UIServlet.doPost(UIServlet.java:258)
         at com.bea.netuix.servlets.manager.UIServlet.service(UIServlet.java:199)
         at com.bea.netuix.servlets.manager.SingleFileServlet.service(SingleFileServlet.java:251)
         at com.bea.netuix.servlets.manager.PortalServlet.service(PortalServlet.java:686)
         at javax.servlet.http.HttpServlet.service(HttpServlet.java:820)
         at weblogic.servlet.internal.StubSecurityHelper$ServletServiceAction.run(StubSecurityHelper.java:227)
         at weblogic.servlet.internal.StubSecurityHelper.invokeServlet(StubSecurityHelper.java:125)
         at weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:292)
         at weblogic.servlet.internal.TailFilter.doFilter(TailFilter.java:26)
         at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:42)
         at com.bea.jsptools.servlet.PagedResultServiceFilter.doFilter(PagedResultServiceFilter.java:82)
         at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:42)
         at com.bea.portal.tools.servlet.http.HttpContextFilter.doFilter(HttpContextFilter.java:60)
         at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:42)
         at com.bea.p13n.servlets.PortalServletFilter.doFilter(PortalServletFilter.java:336)
         at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:42)
         at weblogic.servlet.internal.WebAppServletContext$ServletInvocationAction.run(WebAppServletContext.java:3502)
         at weblogic.security.acl.internal.AuthenticatedSubject.doAs(AuthenticatedSubject.java:321)
         at weblogic.security.service.SecurityManager.runAs(Unknown Source)
         at weblogic.servlet.internal.WebAppServletContext.securedExecute(WebAppServletContext.java:2186)
         at weblogic.servlet.internal.WebAppServletContext.execute(WebAppServletContext.java:2092)
         at weblogic.servlet.internal.ServletRequestImpl.run(ServletRequestImpl.java:1406)
         at weblogic.work.ExecuteThread.execute(ExecuteThread.java:201)
         at weblogic.work.ExecuteThread.run(ExecuteThread.java:173)
    Please reply if any one find solution on this.
    Edited by: 925203 on Apr 3, 2012 6:34 AM
    Edited by: 925203 on Apr 3, 2012 6:35 AM
    Edited by: 925203 on Apr 4, 2012 10:41 PM

    Yes, I am using custom work flow.
    I added new property for alternate text to existing content type Banner. When I try to update value for alternate text it throws error: A RepositoryException was thrown: null
    Even if i try to delete added property it throws error :
    A RepositoryException was thrown: The type Banner has existing node instances. Therefore the removal of property definition alt is not allowed.
    Is there alternate way to add property to existing content type through weblogic content management console?
    Edited by: 925203 on Apr 5, 2012 9:48 PM

  • Pictures not showing when recieved through text on iphone 5

    Pictures come through text they just show a black background that says "loading" and never display the image.

    Restart your phone! I had the same problem. Left it off for a minute and when I turned it back on, pictures would enlarge and load as they should.

  • .gif files no longer working when I send them through text

    Hello,
    I've been sending and receiving animated .gif files through Messages on my iphone for a long time without issue. However the last month or so the ones I send no longer animate. They still work if I view them through safari on my desktop computer so I know the files are not corrupted. The ones that people send me through Messages still work on my phone. But if I send one through text/imessage it's just a static image.
    Anyone have any idea what could be going on or how to fix it?
    Much Appreicated

    No, that's definitely not it.  I subscribe to several newspapers, and the online versions are meant to be printed and saved.  Even when I find an offered up PDF version, it does not matter whether I save it or print it to PDF, it is not being recognized as text. When I do run OCR, it comes out very, very poor quality, which is not the case with scanned items and such.
    I am currently getting by with copy/pasting to a word document, and then saving to PDF from there, for some reason this method IS working as usual.  It does take considerably more time to do, however.
    I'm still very confused at what could have changed in the past several days!

  • Appending data(Image and Text) to a file written with RTFWriter2.

    I have file witten using RTFWriter2 which contains image and text.I nedd to modify the contents of that file at runtime through browsing and selecting the JFileChooser and append the data to existing selected file.
    I write inot the file for the first time using FileOutputStream("filename",ture)
    where true stands for appending data to current file,if does noes have any/not.
    But this does not work when i write the file using RTFWriter2,and i have to use this RTFWriter2 b'coz writing an image to a file is not done by any other way.
    If there is any do let me know and if not then what is the solution to this problem of appending data to existing file written by RTFWriter2.
    Your repkeis will be appreciated.Thank You.

    Mubin_Ahmed wrote:
    Hi,
    I want to write an application which can be used to read a file that contains both images and text.
    It must separate the images and text and write them in separate files..
    Can anyone help me with this please...
    My email id is [email protected]
    Thanks in advance...This forum is to use as a resource for your questions, not a place to enlist someone to program for you. If you have specific questions on what to do, not: "I've not a clue, so explain the wold to me." But specific questions on how to get your code to work or points about Java, then people from all over the world will be happy to help you in the context of the forum, and not through your private e-mail. E-mail defeats the basic purpose of having public forums for learning and exchange of information.

  • Received a picture mail through text messaging. How do I save it? On the Palm Pre

    I received a picture via text message and when I click on the image, it says copy photo at the bottom. So I click copy photo and then a screen comes up and says "photo successfully copied." One question, where does the copied photo go? I go to my photo album and it is no where to be found. Also, when I click the top left corner of the screen, it doesn't allow me to paste. So where does the copied photo go? And when I receive pictures through text messages or SMS messages, can I save them to my photo album? Thanks for your help.
    Post relates to: None
    Message Edited by Briansim on 06-15-2009 02:59 PM

    Ok, well I opened up my text message with the picture, clicked on the picture and it said "copy photo." Clicked "copy photo" and it said photo was successfully copied. Went to my photos and I only have three (photo album options) to select from. Photo roll, All images and wallpapers. There isn't an option for messaging and the picture is not in the "all images album". Unless I'm doing something wrong, I still cannot find my copied photo.

  • Where is the Align Image to Text in DW6 that was in Properties before in DW 5.5

    From CS5.5 - DW 5.5 Help
    Align an image
    You can align an image to text, another image, a plug‑in, or other elements in the same line. You can also set the horizontal alignment of an image.
    Where is this in DW 6. It use to be on the Properties panel and when you clicked the picture the option to align and set padding H & V became available.
    What did they do with it. Where did it go?
    Help.
    P.S. CS6 on a Mac  - OS 10.7.4
    thanks, Jim
    P.S.S. I went through the Reference PDF for DW6 and it says that the Align pulldown is suppose to show up when you highlight-Click a picture. In my software, it is not thee in the properties panel like it use to be. I can not get it to show up. In the picture they show, it does not show the Align but the instructions says it's suppose to be there.
    Any Ideas. I've gone through all the preferences and just can't figure out why I can't see the Align pulldown and the H & V Padding like in all the other version of DW.

    The Align, H, V, and Border fields were removed from the Images Property inspector in Dreamweaver CS6 because they insert attributes that were deprecated in HTML more than ten years ago, and are no longer valid in HTML5.
    Dreamweaver now expects you to use CSS to control these aspects of images. If, for any reason, you don't want to use CSS, those attributes can still be inserted using the Tag Inspector panel or directly in Code view using code hints.

  • How can i send a picture through text?

    Does anyone knows how to send a picture through text message?

    I came across this a while back and thought it was a good read
    There are some interesting challenges with MMS that do not exist with SMS:
    Content adaptation: Multimedia content created by one brand of MMS phone may not be entirely compatible with the capabilities of the recipients' MMS phone. In the MMS architecture, the recipient MMSC is responsible for providing for content adaptation (e.g., image resizing, audio codec transcoding, etc.), if this feature is enabled by the mobile network operator. When content adaptation is supported by a network operator, its MMS subscribers enjoy compatibility with a larger network of MMS users than would otherwise be available.
    Distribution lists: Current MMS specifications do not include distribution lists nor methods by which large numbers of recipients can be conveniently addressed, particularly by content providers, called Value Added Service Providers (VASPs) in 3GPP. Since most SMSC vendors have adopted FTP as an ad-hoc method by which large distribution lists are transferred to the SMSC prior to being used in a bulk-messaging SMS submission, it is expected that MMSC vendors will also adopt FTP.
    Bulk messaging: The flow of peer-to-peer MMS messaging involves several over-the-air transactions that become inefficient when MMS is used to send messages to large numbers of subscribers, as is typically the case for VASPs. For example, when one MMS message is submitted to a very large number of recipients, it is possible to receive a delivery report and read-reply report for each and every recipient. Future MMS specification work is likely to optimize and reduce the transactional overhead for the bulk-messaging case.
    Handset Configuration: Unlike SMS, MMS requires a number of handset parameters to be set. Poor handset configuration is often blamed as the first point of failure for many users. Service settings are sometimes preconfigured on the handset, but mobile operators are now looking at new device management technologies as a means of delivering the necessary settings for data services (MMS, WAP, etc.) via over-the-air programming (OTA).
    WAP Push: Few mobile network operators offer direct connectivity to their MMSCs for content providers. This has resulted in many content providers using WAP push as the only method available to deliver 'rich content' to mobile handsets. WAP push enables 'rich content' to be delivered to a handset by specifying the URL (via binary SMS) of a pre-compiled MMS, hosted on a content provider's web server. A downside of WAP push is that from a billing perspective this content is typically billed at data rates rather than as an MMS. These charges can be significant and result in 'bill shock' for consumers.
    Although the standard does not specify a maximum size for a message, 300 kB is the current recommended size used by networks due to some limitations on the WAP gateway side.

  • How to see through text?

    I've read some online advice about this, but perhaps my question is more complex.  I want to see through text, so a flag photo shows up inside of it.  But below that is another photo (suitcase).  So the text with the flag photo  inside is on top of a suitcase image.    So, how to do?  Mucho many thanks in advance!

    In this case it might be easiet to convert the text to outlines (select the frame not the text itself, so you get a "compund path"), then cut the image and select the type you converted, paste into.

  • Send Image through xml file

    Hey guys,
    I want to send an JPEG image through xml file. i dont want to just give the URL of the image but i want to actually send the image through xml. Im new in XML so can you please give me a working sample code.
    Thank you so much.

    Working code will not be difficult to write. Jpeg or other binary info can be encoded in xml using base64 encoding or some other encoding algorithm.
    After base64 encoding you will get some text which will be the base64 equivalent of the image data. This text can be placed in CDATA section of your image element and transferred.
    On the receiving end you will need to decode the text. After this what u have is the binary data for ur image.
    It will not be difficult to find libraries for base64 encodin/decoding on the net.
    Hope it helps

  • Thumbs with Large Image and Text/Links

    Hi,
    I am running some script on the link below to try and get a look of when you click a thumbnail the large image and text that goes with it changes with each different thumb.  I am able to do that right now, but not to the affect that I want. 
    Ideally I would like all the text to be on the right hand side of the image with spacing and links, but I seem to only be able to get the text to show itself on the bottom of the picture right now.  I think I need to approach it in a different way then I am currently.  Any help would be greatly appreciated.
    This is the page I am working on - http://mnkr.com/womens_stylepages/bigsur_TEST
    Please let me know if I can offer up any other info.
    Kandace

    Sorry to keep replying to my own post, but I am trying to work on this in the meantime.
    I am currently trying to get this to work through this forum - http://forums.adobe.com/message/4001227?tstart=0
    This is what I have done so far and I think I am on on the right track?. 
    http://mnkr.com/womens_stylepages/bigsur_TEST2

  • Create user field image through coding

    i want to create type general and  structure image through coding in vb
    please help

    Hi,
    Below is a table from SAP's SDK documentation. You should use the last option.
    Application
    DI API
    Type
    Structure
    Type
    SubType
    Alphanumeric
    Regular
    db_Alpha
    st_None
    Alphanumeric
    Address
    db_Alpha
    st_Address
    Alphanumeric
    Phone
    db_Alpha
    st_Phone
    Alphanumeric
    Text
    db_Memo
    st_None
    Numeric
    None
    db_Numeric
    st_None
    Date/Hour
    Date
    db_Date
    st_None
    Date/Hour
    Hour
    db_Date
    st_Time
    Units And Totals
    Rate
    db_Float
    st_Rate
    Units And Totals
    Sum
    db_Float
    st_Sum
    Units And Totals
    Price
    db_Float
    st_Price
    Units And Totals
    Quantity
    db_Float
    st_Quantity
    Units And Totals
    Percent
    db_Float
    st_Percentage
    Units And Totals
    Measure
    db_Float
    st_Measurement
    General
    Link
    db_Memo
    st_Link
    General
    Image
    db_Alpha
    st_Image
    Beni.

  • Dreamweaver CC - Rollover image to text transition for Fluid page css/html5

    Hi All,
    I am using Dreamweaver CC, Windows 7, PC.
    Goal: To create a selectable text and colour overlay (not a second image with text in the image) that appears over the top of an image on rollover of the container that the image is located in, all inside a fluid page.  Also I would like to avoid jquery and javascript if it's possible.
    Please see the attached HTML5, CSS and 300x300jpg example of this page which should show what i'm trying to do, as you can see currently the text sits below the image on mouse hover and should be fitting nicely inside the image box.  I will replicate this through all the images once I have it working correctly also.  Please note the page fluid scaling at different sizes as I need the rollover to work at whatever size the window or device is.
    Thank you in advance for any answers, ideas, work arounds etc you may have or if i've missed this specific scenario covered elsewhere?
    Here is the HTML (apologies for my messy code):
    <!doctype html>
    <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
    <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
    <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
    <!--[if gt IE 8]><!-->
    <html class="">
    <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled Document</title>
    <link href="../boilerplate.css" rel="stylesheet" type="text/css">
    <link href="../Website_Testing/style.css" rel="stylesheet" type="text/css">
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script src="../respond.min.js"></script>
    </head>
    <body>
    <div class="gridContainer clearfix">
      <article id="article" class="fluid">
        <div id="Examples" class="fluid">
          <div id="example1" class="fluid">
              <img src="images/300x300.jpg" alt=""/>
              <span class="text">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT </span>
          </div>   
          <div id="example2" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
          <div id="example3" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
          <div id="example4" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
        </div>
      </article>
    </div>
    </body>
    </html>
    Here is the CSS (apologies for my messy code):
    @charset "utf-8";
    img, object, embed, video {
        max-width: 100%;
    /* IE 6 does not support max-width so default to width 100% */
    .ie6 img {
        width:100%;
    .fluid {
        display: block;
        text-align: center;
        clear: none;
        float: none;
    .fluidList {
        list-style:none;
        list-style-image:none;
        margin:0;
        padding:0;       
    /* Mobile Layout: 480px and below. */
    .gridContainer {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        clear: none;
        float: none;
    #article {
        min-height: 160px;
        margin-left: 0;
        padding-left: 5%;
        padding-top: 16px;
        padding-bottom: 16px;
        padding-right: 5%;
        background-color: rgba(255,254,191,1.00);
    #Examples {
        text-align: center;
        padding-top: 16px;
        padding-bottom: 16px;
        margin-left: auto;
        margin-right: auto;
    .zeroMargin_mobile {
    margin-left: 0;
    .hide_mobile {
    display: none;
    #Examples #example1 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example2    {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example3 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example4 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    .text {
        position: relative;
        display: none;
        background: #999;
        background: rgba(0,0,0,0.3);
        text-align: center;
        top: 0px;
    #example1:hover .text {
        display: block;
        background-color: rgba(12,109,242,1);
    #example1 {
        -webkit-transition: all 0.35s ease-in-out 0s;
        -o-transition: all 0.35s ease-in-out 0s;
        transition: all 0.35s ease-in-out 0s;
    #example1:hover {
        background-color: rgba(12,242,109,1.00);
    #example2 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example2:hover {
        background-color: rgba(12,242,109,1.00);
    #example3 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example3:hover {
        background-color: rgba(12,242,109,1.00);
    #example4 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example4:hover {
        background-color: rgba(12,242,109,1.00);
    /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
    @media only screen and (min-width: 481px) {
    .gridContainer {
        width: 100%;
        margin-left: auto;
        min-height: 100%;
    #Examples {
        text-align: center;
        min-height: 640px;
    .hide_tablet {
    display: none;
    .zeroMargin_tablet {
    margin-left: 0;
    #Examples #example1 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example2 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example3 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example4 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    /* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
    @media only screen and (min-width: 769px) {
    .gridContainer {
    #article {
        margin-left: 0;
    #Examples {
        text-align: center;
    .zeroMargin_desktop {
    margin-left: 0;
    .hide_desktop {
    display: none;
    @media only screen and (min-width:1024px){
    #article #Examples #example1 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example2 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example3 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example4 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #Examples {
        min-height: 340px;
    And here is a 300x300 grey image i'm using as an example holder:
    Thanks for taking the time all,
    Jeff

    Try this in a new, blank document:
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>HTML5 with Pure CSS Rollovers</title>
    <style>
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    body {
    font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size:100%;
    #rollover a {
    display: inline-block;
    position: relative;
    margin-right: 2%;
    text-decoration: none;
    color: #FFF;
    #rollover a span {
    display: block;
    visibility: hidden;
    background-color: #3CC;
    position: absolute;
    z-index: 100;
    left: 0;
    top: 0;
    font-size: 13px;
    font-weight:bold;
    line-height: 1.2;
    color: #FFF;
    text-align: center;
    border: 5px solid orange;
    padding: 5px;
    width: 200px;
    min-height: 125px;
    #rollover a:hover span,
    #rollover a:active span,
    #rollover a:focus span { visibility: visible; }
    #rollover a:hover,
    #rollover a:focus { visibility: visible; }
    </style>
    </head>
    <body>
    <div id="rollover">
    <p>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    </p>
    <!--end rollover--></div>
    </body>
    </html>
    Nancy O.

  • Phone won't send image through Messages

    I currently have an iPhone 5 (iOS 7.1.1) and for the last week I haven't been able to send any image through Messages. I'll hit send, and it will show delivered, but after 10-15 seconds it pops up with the red exclamation point and says "Not Delivered." I've tried a hard restart on my phone, turning off wi-fi to see if that was the issue, and checked through my Settings. Everything seems to be in order, but I still can't send them. The only way they will go through is if I send as a Text Message, which is frustrating. Has anyone else had this same issue? Is there a way to fix it? Thanks for any help that you can give!!

    Hi kathim79,
    Welcome to the Apple Support Communities!
    I understand that you are having issues sending MMS messages with iMessage. It sounds like you have already done some good troubleshooting. At this point I would suggest the steps in the following article to help isolate and resolve this issue.
    iOS: Troubleshooting Messages
    http://support.apple.com/kb/ts2755
    Have a great day,   
    -Joe

Maybe you are looking for

  • Reset Manually Entered Constrained Forecast Key Figure

    We use Demand Planning to forecast future Sales Volumes.  Not too sophisticated.  We take a monthly extract from R/3 which summarize the last months Sales Actuals. based on a given period of Sales History we then run a statistical forecast whicgh gen

  • Need help with rule, please. Want to calculate a sum of an accountlist...

    Hello all, i created some accountlists for accountclasses: "Kontenklasse_2" is one of my accountlists and it contains all accounts wich begin with a 2 or H2. So i have an account called "sum_kokl2" and for this i want to calculate the sum of all acco

  • Block Vendor and Customer.

    Dear Experts, Can any tell me is their any procedure to block Vendor...and.....Customer. or Based up on the performence. in PS Module. Plz explain me procedure and customization. Regards Chandra

  • Is Adobe reader touch for windows 8 support interactive PDF files with multi media contents like SWF

    I have many PDF files with SWF content i try Adobe reader X but it is slow, so i try Adobe reader touch for windows 8 but the SWF doesn't work.

  • Minimum no.of products

    hi all i have one query regarding sales order creation. a company is having some brands. each brand is again divided in to products. each product is having different pack size to be sold. the scenario is a customer should order for a minimum of  some