How to make this in CSS

Hello all!
I'm trying to figure out the best way to make this text box using CSS
The purple is just the background. I'm not sure how to apply the shaded sides. My solution is to add the entire box image but some will contain more text and they have to extend. Can someone please give me some guidance?

Here's the trick, the CSS shadow effect is done with CSS3.  The good news is that all modern browsers except IE will see it, the bad news is that IE is not planning on implementing it until version 9 which is currently in the testing phases.  So if you are worried about IE, for the time being what you would do is use Photoshop to make the border and use that as a background image or border and then you can place the text that way.  Typically you would create a 3 divs with the same height, the top and bottom have an image with a corner and the one in the middle you would do this:
background: url(pathto/yourimage.jpg) repeat;
margin: 5px 0; //This would give you 5 pixel margin on the sides, 0 on the top and bottom, this can be changed to reach the desired effect
Then just type in that middle div and it will have the appearance you want.

Similar Messages

  • How to make this in Flash Builder?

    I am looking to make an Android app and one of the functionalities is somehting like in the video.
    I am new to Flash Builder and looking for some help to make it.
    Anyone has a tutrial or has any idea how to make this?
    Android SQLite App Development with Flash Builder and Flex - YouTube

    I'll give you the short answer, Flash Catalyst is built on top of the Flex Framework and it's libraries. When you launch or load a FC swf, it will contact the Adobe servers to check the status of various libraries. Since you are loading this into a standard Flash Professional created swf, you are by passing some of the fallbacks that exist.
    If the movieClip that you are creating is just a filler image, and you are just centering the FC swf, then I also recommend using CSS to display the filler and some HTML/CSS to center the content.
    Hope this helps a little.
    If you did the loading of the FC swf from a Flash Builder based project, you should not have the issue, since it is a Flex based SWF, the framework checks are already handled for you.
    Chris

  • Something keeps trying to download on my mac and I don't know what it is. It is not in the apple store and just comes out nowhere and request for my password to download something and I don't know what it is. How to make this stop?

    Something keeps trying to download on my mac and I don't know what it is. It is not in the apple store and just comes out nowhere and request for my password to download something and I don't know what it is. How to make this stop? It pops up every single day.

    Erica,
         I can, with 99.99% certainty, tell you that you are absolutely right in not wanting to download or install this "Helper," whatever it is (but we can be equally certain it would not "help" anything).
         I cannot comment as to Oglethorpe's recommendation of 'adwaremedic'; I am unfamiliar with it.  His links to the Apple discussion and support pages warrant your time and attention.
         It might be really simple -- Trying looking in your Downloads folder, trash anything that you don't know with certainty is something you want to keep, and then Secure Empty your Trash. Then remove the AdBlock extension, LastPass, and Web of Trust extensions to Safari and re-boot. If the issue goes away, still be extraordinarily careful in the future.
         Unfortunately, it's probably not going to be that simple to get rid of, in which case I'd then try the line by line editing in HT203987. 
         I have no further suggestions (other than a complete wipe and re-install...but that's a pain because trying to restore from Time Machine would simply ... restore the Mal).
       For the rest of us, please post when you find a solution.
         Best.
         BPW
      (Also, try to edit your second post -- black out your last name on the screenshot and re-post it for others)

  • TS2634 I bought a composite AV cable with 30 pin connector at a proper apple store for my ipad 2 which no longer works now i have updated to ios7 - please advise how to make this work ?

    I bought a composite AV cable with 30 pin connector at a proper apple store for my ipad 2 which no longer works now i have updated to ios7 - please advise how to make this work ?

    I have the same problem.
    Two similar discussions:
    https://discussions.apple.com/message/23081658#23081658
    https://discussions.apple.com/message/23281391#23281391
    I have not yet seen any official response to the question: "Is the Apple AV Composite cable fully supported with 30pin connector devices upgraded with iOS7 - specifically ? - eg. iPad 2, iPhone 4, iPhone 4s"
    If it is not currently supported is that then due to a bug / oversight and in that case is it something that will be fixed in the near future?
    Please let us know what feedback you got from asking Apple support.

  • How to make this in Adobe Photoshop CS5? PLEASE Help!

    Hey guys, i reallllllllly  want to know how to make this image in adobe photoshop.... the cone around the forecast track. Can you guys please show me how to do this? Id greatly appreciate it!

    There's a lot implied here, but you're not going to get around having to do the following in general:
    Use an unmarked map as a background.
    Draw shapes on layer(s) above the background and make them partially transparent.
    Obviously the key is to draw shapes that express the "cone of uncertainty" exactly as you want it to look, and with a minimum of fuss.
    I'd suggest drawing shapes with Path tools, then filling the shapes, applying a stroke (for the edge border), and using masking to hide parts you don't want to show (or which overlap with the other parts you're drawing).
    Are you needing to do this over and over or just once?
    -Noel

  • How to make this effect in Keylight?

    Hi, I have question, how to make this effect in Keylight?
    I know that this overlay is added here:
    http://oi57.tinypic.com/1174fup.jpg
    Photos:
    http://iv.pl/images/18475588964010299091.jpg

    Keylight what? All I see is some effect similar to Leave Color, a.k.a the Pleasantville effect that made the rounds 10 years ago. It may require additional masking and otehr effects, but definitely not something that is specifically related to Keylight...
    Mylenium

  • How to make this work flow?

    Hi,
    In a target database such like MySQl, I define a colum role to store the roels in SIM. Then, I want to make a post-workflow that set the account with related role which is defined in the DB after reconciliation and move those accounts from this DB to a specified organzation.
    How to make this workflow?
    If anyone know about this, kindly help me...
    thanks..

    Just a thought... Are you able to run this as activesync? If you use activesync you could just use a form or metaview to merge (or replace) your role value with waveset.roles and set the org for accounts that correlate.
    -Rob

  • How to make this work with Firefox, HELP!

    Downloading for Real-player, after watching the full movie, I click download and it has to reread the movie from the internet. When using explorer, after downloading the movie, it reads it from memory, which makes it a fast download. How to make this work with Firefox, I like not to use Microsoft products, and I really like Firefox 7.0.1!!!! HELP!

    -> click '''Firefox''' button and click '''Options''' (OR File Menu -> Options)
    * Advanced panel -> Network tab
    * place Checkmark on '''Override Automatic Cache Management''' -> under '''Limit Cache''' specify a large size of space
    * Remove Checkmark from '''Tell me when websites asks to store data for offline use'''
    * click OK on Options window
    * Restart Firefox
    Check and tell if ts working.

  • How to make this animation in TwitchPlugin?

    Hi, I have question, how to make this effect and animation in twitch.
    Effect:
    Animation:
    http://youtu.be/UIrSSYjW5-A?t=15s

    If you bought the plug-in you have a bunch of tutorials.
    If you are thinking about buying the plug-in take a look at the tutorials provided by Video CoPilot
    https://www.videocopilot.net/products/twitch/
    If you are still lost AE Basics

  • Anyone knows how to make this code to netbeans??

    anyone knows how to make this code to netbeans?? i just want to convert it into netbeans... im not really advance with this software... anyway..just reply if you have any idea...or steps how to build it... etc.... thanks guys...
       import javax.swing.*;
       import javax.swing.table.*;
       import java.awt.*;
       import java.awt.event.*;
       import java.util.regex.*;
       public class FilterTable {
         public static void main(String args[]) {
           Runnable runner = new Runnable() {
             public void run() {
               JFrame frame = new JFrame("Sorting JTable");
               frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
               Object rows[][] = {
                 {"AMZN", "Amazon", 41.28},
                 {"EBAY", "eBay", 41.57},
                 {"GOOG", "Google", 388.33},
                 {"MSFT", "Microsoft", 26.56},
                 {"NOK", "Nokia Corp", 17.13},
                 {"ORCL", "Oracle Corp.", 12.52},
                 {"SUNW", "Sun Microsystems", 3.86},
                 {"TWX",  "Time Warner", 17.66},
                 {"VOD",  "Vodafone Group", 26.02},
                 {"YHOO", "Yahoo!", 37.69}
               Object columns[] = {"Symbol", "Name", "Price"};
               TableModel model =
                  new DefaultTableModel(rows, columns) {
                 public Class getColumnClass(int column) {
                   Class returnValue;
                   if ((column >= 0) && (column < getColumnCount())) {
                     returnValue = getValueAt(0, column).getClass();
                   } else {
                     returnValue = Object.class;
                   return returnValue;
               JTable table = new JTable(model);
               final TableRowSorter<TableModel> sorter =
                       new TableRowSorter<TableModel>(model);
               table.setRowSorter(sorter);
               JScrollPane pane = new JScrollPane(table);
               frame.add(pane, BorderLayout.CENTER);
               JPanel panel = new JPanel(new BorderLayout());
               JLabel label = new JLabel("Filter");
               panel.add(label, BorderLayout.WEST);
               final JTextField filterText =
                   new JTextField("SUN");
               panel.add(filterText, BorderLayout.CENTER);
               frame.add(panel, BorderLayout.NORTH);
               JButton button = new JButton("Filter");
               button.addActionListener(new ActionListener() {
                 public void actionPerformed(ActionEvent e) {
                   String text = filterText.getText();
                   if (text.length() == 0) {
                     sorter.setRowFilter(null);
                   } else {
                     try {
                       sorter.setRowFilter(
                           RowFilter.regexFilter(text));
                     } catch (PatternSyntaxException pse) {
                       System.err.println("Bad regex pattern");
               frame.add(button, BorderLayout.SOUTH);
               frame.setSize(300, 250);
               frame.setVisible(true);
           EventQueue.invokeLater(runner);
       }

    its okay onmosh.....what we need to
    this...forum....is to have a good......relationship
    of programmers......and to start with .....we need to
    have a good attitude........right.....???.....no
    matter how good you are in programming but if you did
    not posses the right kind of attitude....everything
    is useless.....in the first place....all we
    want....is just to ask...some....help....but
    conflicts......but unluckily......we did not expect
    that there are members in here which......not
    good...to follow.....just as suggestion for those
    people not having the right kind of attidude...why
    can't you do in a very nice message sharing in a very
    nice....way....why we need to put some
    stupid....stuff...words.....can't you live with out
    ******* ****....its not.....lastly especially you
    have your children right now and people around...that
    somehow......idiolize...you even me....is one of
    them......but showing but attitude....is not
    good......tnx....hope you'll take it this....in the
    positive side.....be optimistic...guys....the
    world..is not yours....all of us will just past
    away....always..remember that one.....treasure..our
    stay in this....temporary home.....which...is
    world....Whoa. That post seems to be killing my brain.
    URK
    Join........us..........do not be..........afraid.......

  • How to make this validation ?

    Dear all
    In my Entity Object I have 4 attributes:
    ID , AccomplishDate ,cancelDate,Status
    I want to make a validation on the Status attribute , which is:
    if status = "CAN" then the CancelDate attribute value will be current date and the AccomplishDate attribute value be null.
    Please can any one tell me how to make this validation.
    Thanks

    Thank you so much for replaying
    The original method was
        public void setProcStatus(String value) {
                 setAttributeInternal(PROCSTATUS, value);
        }I changed it to be like this
          public void setProcStatus(String value) {
            if (value.equals("CAN")){
              setAccomplishDate(new Date());
              setCancelDate(null);
            setAttributeInternal(PROCSTATUS, value);
        }is this right
    please tell me how to set the value of AccomplishDate attribute to the current date

  • How to make this pattern?

    Hello guys Please I am looking for advice how to make this kind of pattenr in pohtoshop- you can see it on background- the rounded one- en the end whole piece makes nice surface.
    http://vladstudio.deviantart.com/art/Typographic-World-Map-106395788
    thank a lot

    Sometimes a patten is defined for some pixel size and may even need to have the document rotated to have the proper orientation for the pattern. For example a frame pattern for a one inch wide strip.  An Action can be created to add the pattern to a mitered 1" wide strip at 300 dpi  on the left side then rotate the document for the other side rotate back and dupe and flip the frame side added.
    If you search the web there are a countless number of patterns that can be downloaded for free textures like woods ,paper, textiles etc.

  • How to make this logo effect? Help please!

    How to make this effect? I'm new in illustrator.

    It looks like 3 discs with a 2d image applied to them. I would try the 3d revolve tool to create one, then duplicate it for the other two.

  • How do make this query ?

    CREATE TABLE CLIENT (
         CLIENTID NUMBER PRIMARY KEY,
         NAME VARCHAR2(40)
    CREATE TABLE SALESMAN (
         SALESMANID NUMBER PRIMARY KEY,
         NAME VARCHAR2(40),
         ALL_CLIENTS NUMBER -- ACCESS ALL CLIENTS IF VALUE IS 1
    CREATE TABLE CLIENTSALESMAN (
         SALESMANID NUMBER,
         CLIENTID NUMBER
    INSERT INTO CLIENT VALUES(1,'Bob');
    INSERT INTO CLIENT VALUES(2,'Jhon');
    INSERT INTO CLIENT VALUES(3,'Robert');
    INSERT INTO CLIENT VALUES(4,'Clarck');
    INSERT INTO SALESMAN VALUES (1,'Christina',0);
    INSERT INTO SALESMAN VALUES (2,'Doug',1); -- access all clients
    INSERT INTO CLIENTSALESMAN VALUES (1,1);
    INSERT INTO CLIENTSALESMAN VALUES (1,2);
    How do you return all the clients of a salesman ? same that SALESMAN.ALL = 1 OR SALESMAN.ALL = 0.
    the salesman.all is 1 then he access all clients no need insert in CLIENTSALESMAN. If SALESMAN.ALL = 0 he
    access clientsalesman.
    Does somebody some suggestion how i make this ?
    thanks !

      1  select *
      2  from (select a.name SALESMAN, b.name CLIENT
      3  from   salesman a, client b, clientsalesman
      4  where  a.SALESMANID = c.SALESMANID
      5  and    b.CLIENTID = c.CLIENTID
      6  union
      7  select a.name SALESMAN, b.name CLIENT
      8  from   salesman a, client b
      9  where   a.ALL_CLIENTS = 1)
    10* where salesman = '&1'
    SQL> /
    Enter value for 1: Christina
    old  10: where salesman = '&1'
    new  10: where salesman = 'Christina'
    Christina                                Bob
    Christina                                Jhon
    SQL> /
    Enter value for 1: Doug
    old  10: where salesman = '&1'
    new  10: where salesman = 'Doug'
    Doug                                     Bob
    Doug                                     Clarck
    Doug                                     Jhon
    Doug                                     RobertNicolas.

  • How to Make a "fonts.css" style sheet

    Hi, I  have a wordpress blog with a stylesheet named “style.css”. I want to change the fonts in the style sheet and so I want to create a separate style sheet named “fonts.css"
    I could just duplicate the ”style.css” page and then rename it “fonts.css” but I believe I read somewhere it is better to create a new style sheet named “fonts.css” and then add my font styles to that. Doens anyone know of a tutorial or how I make the new style sheet and add my fonts?

    I only typically use two stylesheets on any given site, layout.css and styles.css. One is for the overall layout/positioning info of the site and the other is the style information which would include fonts, colors, shadows, transitions, etc.
    If it is better in your mind and for your workflow to create a third stylesheet just for the font values, go for it. To me, fonts are just another style element though, so they stay in my styles.css file.
    There's really no right or wrong to doing it either way. Just make sure you create another link in the head section of your site to the new file if you create fonts.css.
    Thanks jon,
    Yes I agree, I could just change the fonts in “style.css” and then have less style sheets, but the themes developer told me to create a new style sheet named “fonts.css” only because the theme is updated regularly and uploading a new theme will write over the file named “style.css” and then your fonts will default to their original fonts.
    I don't see anything wrong with that approach. Just remember that if you have both styesheets linked to the same page then the page will get it's css styles from the last linked stylesheet.
    So for instance if you have:
    body {
    font-size: 14px ;
    in the style.css
    and
    body {
    font-size: 12px ;
    in the fonts.css
    and the last linked stylesheet was styles.css the page would display 14px text.
    So you just need to get them in the right order IF you have more than one styleshet linked to a page.
    Thanks Osgood,
    Yes that was my other question. So in my uploaded CSS folder I have the original “style.css” file and now my new “fonts.css” file. “style.css” is above the “fonts.css” file and both contain the same information except the file “fonts.css’ has been changed to use different fonts.
    So if I understand you correctly I need to either move the file “fonts.css" above the file “style.css” or delete “style .css” from the CSS folder so the file “fonts.css” will take precedence. Is this correct?
    Also, I needed to open style.php and edit the code to include “fonts.css” which I did.
    I opened "style.php" and then added the code in "red" then uploaded it to the (CSS) folder on the server.
    <?php
    header( "Content-type: text/css" );
    $files = array();
    $files[] = 'style.css';
    $files[] = 'responsive.css';
    $files[] = 'fonts.css';
    foreach($files as $file) :
        $content = @file_get_contents( $file );
        echo minify( $content );
    endforeach;
    function minify( $code ) {
              $code = preg_replace( '#\s+#', ' ', $code );
              $code = preg_replace( '#/\*.*?\*/#s', '', $code );
              $code = str_replace( '; ', ';', $code );
              $code = str_replace( ': ', ':', $code );
              $code = str_replace( ' {', '{', $code );
              $code = str_replace( '{ ', '{', $code );
              $code = str_replace( ', ', ',', $code );
              $code = str_replace( '} ', '}', $code );
              $code = str_replace( ';}', '}', $code );
              return trim( $code );
    ?>
    After doing all of this I still didn’t see any changes to my fonts so I must have done something wrong.
    Any ideas?

Maybe you are looking for

  • HT1459 How do I restore my ipod when it is in the disable mode. I have try everything.

    i need help restoreing my ipod it is in the disable mode. I have connect it to itunes and it tell me that i need to enter a passcode which i have forgotten. I have tryed the holding the home buttom thing but that want work. What else can i try?

  • Firewire Drive/Camcorder Problems with FCP

    I seem to have a recurring problem connecting a DV camcorder and a firewire hard drive simultaneously. Most recently I was trying to set up FCP to output to a camcorder I had connected - and during the configuration, my hard drive (a western digital

  • Has Google Mail stopped support for Apple Mail on OS X 10.5.8 Leopard?

    My Mom has an old 800 MHz eMac running OS X 10.5.8 and she can no longer access her Gmail account. Her last email  was from July 2014. Did Google discontinue supoort for OS X Leopard and older Apple Mail App? Does anyone know this or can confirm this

  • AM_AI CREATED WS00000024 Error when processing worklist (AR31)

    Hello everyone, can anyone explain what this error is about? For your information, I have created a worklist with substitution, to update the depreciation keys in asset master. However, when I do transaction AR31, I got the following message in my in

  • Document folders

    How do I create a file folder to put my documents into? Then, how do I put documents in the file folder?