Search Results

Search found 12873 results on 515 pages for 'css expressions'.

Page 86/515 | < Previous Page | 82 83 84 85 86 87 88 89 90 91 92 93  | Next Page >

  • What is the best strategy for transforming unicode strings into filenames?

    - by David Cowden
    I have a bunch (thousands) of resources in an RDF/XML file. I am writing a certain subset of the resources to files -- one file for each, and I'm using the resource's title property as the file name. However, the titles are every day article, website, and blog post titles, so they contain characters unsafe for a URI (the necessary step for constructing a valid file path). I know of the Jersey UriBuilder but I can't quite get it to work for my needs as I detailed in a different question on SO. Some possibilities I have considered are: Since each resource should also have an associated URL, I could try to use the name of the file on the server. The down side of this is sometimes people don't name their content logically and I think the title of an article better reflects the content that will be in each text file. Construct a white list of valid characters and parse the string myself defining substitutions for unsafe characters. The downside of this is the result could be just as unreadable as the former solution because presumably the content creators went through a similar process when placing the files on their server. Choose a more generic naming scheme, place the title in the text file along with the other attributes, and tell my boss to live with it. So my question here is, what methods work well for dealing with a scenario where you need to construct file names out of strings with potentially unsafe characters? Is there a solution that better fills out my constraints?

    Read the article

  • Regular Expression HTML tags

    - by user134615
    I'd like to know whether it exists a way to put the following HTML tags in a regex. What I want is a regex that can match all the start tags with their corresponding closing tags. E.g., Hello There might be more tags inside. I had thought of something like this: ^<([a-z]+)([^<]+)(?:(.)</\1|\s+/)$/, but it wont work. Sorry if this question doesnt belong to this section. Thank you.

    Read the article

  • Regex syntax question - trying to understand

    - by Asaf Chertkoff
    i don't know if this question belong here or no, but it is worth a shot. i'm a self taught php programmer and i'm only now starting to grasp the regex stuff. i'm pretty aware of its capabilities when it is done right, but this is something i need to dive in too. so maybe someone can help me, and save me so hours of experiment. i have this string: here is the <a href="http://www.google.com" class="ttt" title="here"><img src="http://www.somewhere.com/1.png" alt="some' /></a> and there is <a href="#not">not</a> a chance... now, i need to perg_match this string and search for the a href tag that has an image in it, and replace it with the same tag with a small difference: after the title attribute inside the tag, i'll want to add a rel="here" attribute. of course, it should ignore links (a href's) that doesn't have img tag inside. help will be appreciated, thanks.

    Read the article

  • How I use RegExp in my Java program? [migrated]

    - by MIH1406
    I have the following string examples: 00001 1 12 123 00002 3 7 321 00003 99 23 332 00004 192 50 912 In a separate text file. Numbers are separated by tabs not spaces. I tried to read the file and print each line if it matches a given RegExp, but I could not find the suitable RegExp for these lines. private static void readFile() { String fileName = "processes.lst"; FileReader file = null; String result = ""; try { file = new FileReader(fileName); BufferedReader reader = new BufferedReader(file); String line = null; String regEx = "[0-9]\t[0-9]\t[0-9]\t[0-9]"; while((line = reader.readLine()) != null) { if(line.matches(regEx)) { result += "\n" + line; } } } catch(Exception e) { System.out.println(e.getMessage()); } finally { if(file != null) try { file.close(); } catch(Exception e) { System.out.println(e.getMessage()); } } System.out.println(result); } I ended up without any string being printed!!

    Read the article

  • Global UTF-encoding, the right way

    - by mowgli
    I'm curious, as to what is the right way to have UTF-8 encoding on all web files All my files (incl. CSS and JS) are made and saved in UTF-8 encoding In PHP, I set the char-set on top of the main page (this page includes all others) with: header('Content-type: text/html; charset=utf-8'); In the same page I have this html meta tag: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> Then I stubled upon an external css file that has this on first line: @charset "UTF-8"; And now I wonder, should I set the charset INSIDE all my CSS/JS files too, like that? And/or should I serve each file with charset=utf-8 in the meta tag?

    Read the article

  • String patterns that can be used to filter and group files

    - by Louis Rhys
    One of our application filters files in certain directory, extract some data from it and export a document from the extracted data. The algorithm for extracting the data depends on the file, and so far we use regex to select the algorithm to be used, for example .*\.txt will be processed by algorithm A, foo[0-5]\.xml will be processed by algo B, etc. However now we need some files to be processed together. For example, in one case we need two files, foo.*\.xml and bar.*\.xml. Part of the information to be extracted exist in the foo file, and the other part in the bar file. Moreover, we need to make sure the wild card is compatible. For example, if there are 6 files foo1.xml foo23.xml bar1.xml bar9.xml bar23.xml foo4.xml I would expect foo1 and bar1 to be identified as a group, and foo23 and bar23 as another group. bar9 and foo4 has no pair, so they will not be treated. Now, since the filter is configured by user, we need to have a pattern that can express the above requirement. I don't think you can express meaning like above in standard regex. (foo|bar).*\.xml will match all 6 file above and we can't identify which file is paired for a particular file. Is there any standard pattern that can express it? Or any idea how to modify regex to support this, that can be implemented easily?

    Read the article

  • CSS3 - "connecting" 2 classes animation [closed]

    - by Nave Tseva
    I have this CSS +HTML code: <!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>What</title> <style type="text/css"> #page { width: 900px; padding: 0px; margin: 0 auto; direction: rtl; position: relative; } #box1 { position: relative; width: 500px; border: 1px solid black; box-shadow: -3px 8px 34px #808080; border-radius: 20px; box-shadow: -8px 5px 5px #888888; right: 300px; top: 250px; height: 150px; -webkit-transition: all 1s; font-size: large; color: Black; padding: 10px; background: #D0D0D0; opacity: 0; } @-webkit-keyframes myFirst { 0% { right: 300px; top: 150px; background: #D0D0D0; opacity: 0; } 100% { background: #909090; ; right: 300px; top: 200px; opacity: 1; } } #littlebox1 { top: 200px; position: absolute; display: inline-block; } .littlebox1-sentence { font-size: large; padding-bottom: 15px; padding-top: 15px; padding-left: 25px; padding-right: 10px; background: #D0D0D0; border-radius: 10px; -webkit-transition: background .25s ease-in-out; } #littlebox1:hover ~ #box1 { -webkit-transition: all 0s; background: #909090;; right: 300px; top: 200px; -webkit-animation: myFirst 1s; -webkit-animation-fill-mode: initial; opacity: 1; } .littlebox1-sentence:hover { background: #909090; } .littlebox1-sentence:hover + .triangle { border-right: 50px solid #909090; } .triangle { position: relative; width: 0; height: 0; border-right: 50px solid #D0D0D0; border-top: 24px solid transparent; border-bottom: 24px solid transparent; right: 160px; -webkit-transition: border-right .25s ease-in-out; } .triangle:hover { border-right:50px solid #909090; } </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> $(function() { $('.littlebox1-sentence').hover(function() { $(this).css('background', '#909090'); $('.triangle').css('border-right', '50px solid #909090'); }); </script> <script> $(function() { $('.triangle').hover(function() { $(this).css('border-right', '50px solid #909090'); $('.littlebox1-sentence').css('background', '#909090'); }); </script> </head> <body dir="rtl"> <div id="page"> <div id="littlebox1" class="littlebox1-sentence">put your mouse here</div><div id="littlebox1" class="triangle"> </div> <div id="box1"> </div> </div> </body> </html> Live example you will find here: http://jsfiddle.net/FLe4g/12/ The problem here that something here wrong in the second jquery code. I want that every time that I put the mouse on the box, or on the triangke they both will change ther color together. when I put the mouse on the box it works fine, but when I put the mouse on the triangle it don't work. Any suggestions how to fix this code?

    Read the article

  • Regex to String generation

    - by Mifmif
    Let's say that we have a regex and an index i , if we suppose that the set of string that match our regex are sorted in a lexicographical order, how could we get the i element of this list ? Edit : I added this simple example for more explanation : input : regex="[a-c]{1,2}"; index=4; in this case the ordered list of string that matches this regex contains those elements : a aa ab ac b ba bb bc c ca cb cc output : the 4th element which is ac ps: it's known that the string list that match the regex have infinite element, this doesn't have an impact on the proccess of extracting the element in the given index.

    Read the article

  • Is it okay to introduce LESS to not so savvy UI Designers?

    - by Jason Nathan
    I just got a job as lead developer and I thought it would be best to seek the expertise of my peers (that's you) before proceeding! I had the opportunity to review my designers and they are mostly photoshop pros with dreamweaver as their main HTML/CSS editor. A more visual experience. I, on the other hand, have had much experience hand-writing all my code. From HTML markup to CSS. From my understanding, my designers have basic CSS knowledge and I am considering a simple 101 style set of tutorials for them to get a better grasp of markup before I moved into more advanced topics like accessibility and microformat markup. We need to get started up quickly. Do you think it's okay to dive into LESS from the get-go?

    Read the article

  • Web optimization

    - by hmloo
    1. CSS Optimization Organize your CSS code Good CSS organization helps with future maintainability of the site, it helps you and your team member understand the CSS more quickly and jump to specific styles. Structure CSS code For small project, you can break your CSS code in separate blocks according to the structure of the page or page content. for example you can break your CSS document according the content of your web page(e.g. Header, Main Content, Footer) Structure CSS file For large project, you may feel having too much CSS code in one place, so it's the best to structure your CSS into more CSS files, and use a master style sheet to import these style sheets. this solution can not only organize style structure, but also reduce server request./*--------------Master style sheet--------------*/ @import "Reset.css"; @import "Structure.css"; @import "Typography.css"; @import "Forms.css"; Create index for your CSS Another important thing is to create index at the beginning of your CSS file, index can help you quickly understand the whole CSS structure./*---------------------------------------- 1. Header 2. Navigation 3. Main Content 4. Sidebar 5. Footer ------------------------------------------*/ Writing efficient CSS selectors keep in mind that browsers match CSS selectors from right to left and the order of efficiency for selectors 1. id (#myid) 2. class (.myclass) 3. tag (div, h1, p) 4. adjacent sibling (h1 + p) 5. child (ul > li) 6. descendent (li a) 7. universal (*) 8. attribute (a[rel="external"]) 9. pseudo-class and pseudo element (a:hover, li:first) the rightmost selector is called "key selector", so when you write your CSS code, you should choose more efficient key selector. Here are some best practice: Don't tag-qualify Never do this:div#myid div.myclass .myclass#myid IDs are unique, classes are more unique than a tag so they don't need a tag. Doing so makes the selector less efficient. Avoid overqualifying selectors for example#nav a is more efficient thanul#nav li a Don't repeat declarationExample: body {font-size:12px;}h1 {font-size:12px;font-weight:bold;} since h1 is already inherited from body, so you don't need to repeate atrribute. Using 0 instead of 0px Always using #selector { margin: 0; } There’s no need to include the px after 0, removing all those superfluous px can reduce the size of your CSS file. Group declaration Example: h1 { font-size: 16pt; } h1 { color: #fff; } h1 { font-family: Arial, sans-serif; } it’s much better to combine them:h1 { font-size: 16pt; color: #fff; font-family: Arial, sans-serif; } Group selectorsExample: h1 { color: #fff; font-family: Arial, sans-serif; } h2 { color: #fff; font-family: Arial, sans-serif; } it would be much better if setup as:h1, h2 { color: #fff; font-family: Arial, sans-serif; } Group attributeExample: h1 { color: #fff; font-family: Arial, sans-serif; } h2 { color: #fff; font-family: Arial, sans-serif; font-size: 16pt; } you can set different rules for specific elements after setting a rule for a grouph1, h2 { color: #fff; font-family: Arial, sans-serif; } h2 { font-size: 16pt; } Using Shorthand PropertiesExample: #selector { margin-top: 8px; margin-right: 4px; margin-bottom: 8px; margin-left: 4px; }Better: #selector { margin: 8px 4px 8px 4px; }Best: #selector { margin: 8px 4px; } a good diagram illustrated how shorthand declarations are interpreted depending on how many values are specified for margin and padding property. instead of using:#selector { background-image: url(”logo.png”); background-position: top left; background-repeat: no-repeat; } is used:#selector { background: url(logo.png) no-repeat top left; } 2. Image Optimization Image Optimizer Image Optimizer is a free Visual Studio2010 extension that optimizes PNG, GIF and JPG file sizes without quality loss. It uses SmushIt and PunyPNG for the optimization. Just right click on any folder or images in Solution Explorer and choose optimize images, then it will automatically optimize all PNG, GIF and JPEG files in that folder. CSS Image Sprites CSS Image Sprites are a way to combine a collection of images to a single image, then use CSS background-position property to shift the visible area to show the required image, many images can take a long time to load and generates multiple server requests, so Image Sprite can reduce the number of server requests and improve site performance. You can use many online tools to generate your image sprite and CSS, and you can also try the Sprite and Image Optimization framework released by The ASP.NET team.

    Read the article

  • how to speed up this code? [migrated]

    - by dot
    I have some code that's taking over 3 seconds to complete. I'm just wondering if there's a faster way to do this. I have a string with anywhere from 10 to 70 rows of data. I break it up into an array and then loop through the array to find specific patterns. $this->_data = str_replace(chr(27)," ",$this->_data,$count);//strip out esc character $this->_data = explode("\r\n", $this->_data); $detailsArray = array(); foreach ($this->_data as $details) { $pattern = '/(\s+)([0-9a-z]*)(\s+)(100\/1000T|10|1000SX|\s+)(\s*)(\|)(\s+)(\w+)(\s+)(\w+)(\s+)(\w+)(\s+)(1000FDx|10HDx|100HDx|10FDx|100FDx|\s+)(\s*)(\w+)(\s*)(\w+|\s+)(\s*)(0)/i'; if (preg_match($pattern, $details, $matches)) { array_push($detailsArray, array( 'Port' => $matches[2], 'Type' => $matches[4], 'Alert' => $matches[8], 'Enabled' => $matches[10], 'Status' => $matches[12], 'Mode' => $matches[14], 'MDIMode' => $matches[16], 'FlowCtrl' => $matches[18], 'BcastLimit' => $matches[20])); }//end if }//end for $this->_data = $detailsArray; Just wondering if you think there's a way to make it more efficient. Thanks.

    Read the article

  • Is CSS Inheritance in Internet Explorer 8 still buggy?

    - by rrrr
    I have a situation that I am looking at where certain CSS properties will not be inherited. This revolves around tables and IE8. Using the sample HTML below I cannot get the text within the table to inherit the green colour. This works in Firefox and Chrome, but not IE8 and from reading up this seems to have always been a problem in IE but was meant to be working in version 8 from what I read. I have tried to specify the inherit value everywhere possible, but to no avail so the question is whether the CSS inheritance support in IE8 is buggy, or am I missing something? I don't want answer changing inline CSS to be classes and I certainly dont wan't any comments on tables as this all stems from building and designing HTML emails where inline CSS and tables are essential. <html> <head></head> <body> <table style="color: green;"> <tr> <td> <span>Span</span> <p>Paragraph</p> <div>Div</div> <table style="color:inherit;"> <tr> <td>Table</td> </tr> </table> </td> </tr> </table> </body> </html>

    Read the article

  • What is your workflow when designing HTML/CSS layouts?

    - by DMin
    I have been working with PHP/MySQL as a hobby for close to a couple of years now, I have been working with photoshop for a very long time, I know CSS & HTML well enough to write without any reference, so, I would not consider myself someone who's very new at this. I have recently started developing websites professionally - (only person working on the project). I have seen the power of Joomla and how you can make a website ready for your customer in a matter of hours(if not minutes). I find it very hard to make layouts that remotely look like the themes on joomla. I find making even simple layouts a very cumbersome process and takes a lot of time to get a good enough output. I have a feeling I may not be using the right tools or workflow for the job. What I wanted to findout was, as part of the industry : How do, you, make your website when you do it from scratch? What are the tools that you use? What is your workflow? Just noted a few things I know already, for your reference(You can skip this if you like) I have seen the export for web for Photoshop that exports CSS - but (as far as I know) exports only absolutely positioned webpages so they need to be beaten and fixed if you want to use them for example for joomla. I have used the SiteGrinder plugin for Photoshop that exports HTML/CSS. It looks promising but haven't tried it extensively. One of the tools that save loads of time is FireBug. This makes it easy to edit html and css on the fly and get the page looking exactly as you want it. Recently stumbled upon fireworks. But haven't explored it much. Thanks! :)

    Read the article

  • How do I get the element after my horizontal css navigation bar to appear below it?

    - by Curyous
    I'm using a css unordered list to make a site navigation bar, using display: inline, display: block, and float: left. The next element that I put after the navigation bar is placed to the right of it. How can I align the next element so that it is displayed below? The html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <link type="text/css" rel="stylesheet" href="/stylesheets/test.css" /> </head> <body> <div> <ul class="nav"> <li class="nav"><a class="nav" href="#">One1</a></li> <li class="nav"><a class="nav" href="#">Two</a></li> <li class="nav"><a class="nav" href="#">Three</a></li> <li class="nav"><a class="nav" href="#">Four</a></li> </ul> </div> <div><h2>Heading</h2></div> </body> </html> The css: ul.nav, ul li.nav { display: inline; margin: 0px; padding: 0px; } ul.nav { list-style-type: none; } li.nav { display: block; float: left; background-color: red; } a.nav { background-color: green; padding: 10px; margin: 0px; } a:hover.nav { background-color: gray; }

    Read the article

  • How to get rid of white space between css horizontal list items?

    - by Curyous
    I've got the following test page and css. When displayed, there is a 4px gap between each list item. How do I get the items to be next to each other? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <link type="text/css" rel="stylesheet" href="/stylesheets/test.css" /> </head> <body> <div> <ul class="nav"> <li class="nav"><a class="nav" href="#">One1</a></li> <li class="nav"><a class="nav" href="#">Two</a></li> <li class="nav"><a class="nav" href="#">Three</a></li> <li class="nav"><a class="nav" href="#">Four</a></li> </ul> </div> </body> </html> The css: ul.nav, ul li.nav { display: inline; margin: 0px; padding: 0px; } ul.nav { list-style-type: none; } li.nav { background-color: red; } a.nav { background-color: green; padding: 10px; margin: 0px; } a:hover.nav { background-color: gray; }

    Read the article

  • Can CSS change the apparent sequence of elements, e.g. using float or position?

    - by ChrisW
    Edit: answer to this question is easy, a simple example of float left and float right. I'd like to float some annotations to the left of a topic using HTML and CSS, for example the 'status' and 'author' annotations shown in the following mockup/image: For semantic reasons, perhaps: I prefer to use CSS instead of a table-based layout In the HTML, the status should appear after the corresponding heading For example: <h1>This is a section title</h1> <div class="status">approved</div> <div class="author">chris</div> <p>This is some text. Lorem ipsum.</p> <p>Lorem ipsum.</p> <h1>Different section title</h1> <div class="status">rejected</div> <p>Lorem ipsum.</p> I'd like the annotations to be after the heading in the HTML, because everything associated with (i.e. the contents of) a topic is usually whatever is after the topic's heading. However I'd like the annotations to be displayed before (to the left of) the heading, as illustrated above. Is this possible? What is the most semantic HTML, and corresponding CSS, that will render as shown above? Would you recommend a table-based layout instead? Even if that means putting the headings in a table cell? It may not be possible; this answer suggests it isn't possible ... but I don't know CSS well enough to say that for sure.

    Read the article

  • How to handle javascript & css files across a site?

    - by Industrial
    Hi everybody, I have had some thoughts recently on how to handle shared javascript and css files across a web application. In a current web application that I am working on, I got quite a large number of different javascripts and css files that are placed in an folder on the server. Some of the files are reused, while others are not. In a production site, it's quite stupid to have a high number of HTTP requests and many kilobytes of unnecessary javascript and redundant css being loaded. The solution to that is of course to create one big bundled file per page that only contains the necessary information, which then is minimized and sent compressed (GZIP) to the client. There's no worries to create a bundle of javascript files and minimize them manually if you were going to do it once, but since the app is continuously maintained and things do change and develop, it quite soon becomes a headache to do this manually while pushing out new updates that features changes to javascripts and/or css files to production. What's a good approach to handle this? How do you handle this in your application?

    Read the article

  • What CSS do I need to make my site more responsive?

    - by user2938757
    My site is: http://library.skybundle.com I feel like I almost have a responsive site. I did all the CSS styling myself. It is a Wordpress site but I completely edited the CSS of the original theme, so it is night-and-day different than it used to be. The original theme was mostly just for a canvas for me to work with, since I am not an expert in PHP and we wanted a Wordpress site for easy editing later on. Thanks to stackoverflow, I now have a footer that sticks to the bottom of every page and everything mostly looks good -- the way we want it anyway. The only thing missing now is the we want browser windows on MOBILE devices, such as on an iPhone, to automatically adjust the layout of the content in the body (wrapper). For example, on the main page (library.skybundle.com), I would like those two big icons two become vertically aligned as soon as the browser window sizes to a small, mostly vertical size, like that of a mobile phone. Take this site, for example: http://freedomsoundproductions.securesb.net/ This is what we would like it to do. So one a page with a sidebar, the content to the right of the sidebar should basically jump into the same "column" as the left sidebar and form one single long column. Just like in the example site above. This should all be possible via CSS. People in other forums seem to want me to use jQuery and stuff, but I can only use CSS, and I know that this must be possible without having to resort to jQuery, HTML, or other code.

    Read the article

  • Mircosoft Expressions rejecting FP extensions

    - by Moe
    Hey there, I've just moved to a new server and I can't seem to get FrontPage extensions to work with Mircosoft Expressions. I like to edit my site Live rather then local to server. But Now, when I access my domain.. eg: http://domain.com It'll come up with: Access Denied. And if I click details it returns 501 Method Not Implemented Method Not Implemented GET to / not supported. Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request. If I define (in .htaccess): ErrorDocument 404 /404.php The Details returns the Title and contents of 404.php. And if I define (in .htaccess): ErrorDocument 404 /404.php ErrorDocument 501 /501.php The Details return nothing. What Am I doing wrong? Thanks.

    Read the article

  • Help updating cron entry using regular expressions

    - by Uday
    hi I am trying to update a cron entry NOT by using crontab -e but by shell commands. For example the cron entry is like this: 10 * * * * /home/localuser/foo.sh -b 1 -h 4 > foo_output.sh 2>&1 No i need edit the command line parameters part ONLY i.e -b 1 -h 4 to something else which will be coming in from the user. First thing would be to write the crontab to a tmp file and then manipulate that temp file. Now, is there an easy way to edit that line using SED or something? The crude way wud be to delete that entire line, write a new line with the entire expression and then load that into the cron. I am not very good with regular expressions. My system supports sed -i so was thinking this could be done in a single line command. Thanks in advance

    Read the article

  • Telerik RadEditor for MOSS - How do I suppress min-width inline CSS?

    - by James
    I'm having an issue with the RadEditor for MOSS, I'm really baffled as to the source of this issue. I tried using Firebug to find where any min-* CSS settings are happening and search came up empty, but I know it's happening because the downloaded page markup does not have that inline CSS. I believe that one of the Telerik control emitted Javascripts is what is adding inline CSS style to the top level div of the editor, namely min-height, min-width. This is causing layout issues on my page. My question is why is it doing this, and more importantly how do I prevent this from happening? <div style="height: 300px; width: 100%; min-height: 300px; min-width: 1133px;" class="RadEditor Default reWrapper ms-input"> Related thread

    Read the article

  • A Few of My Favorite HTML5 and CSS3 Online Tools

    - by dwahlin
    I really enjoy coding up HTML5, CSS3, and JavaScript applications but there are some things that I’m better off writing with the help of a development tool. For example, CSS3 gradients aren’t exactly the most fun thing to write by hand and the same could be said for animations, transforms, or styles that require various vendor extensions. There are a lot of online tools that can simplify building HTML5/CSS3 sites and increase productivity in the process so I thought I’d put together a post on a few of my favorites tools. HTML5 Boilerplate HTML5 Boilerplate provides a great way to get started building HTML5 sites. It includes many best practices out of the box and even includes a few tricks that many people don’t even know about. The custom download option allows you to pick the features that you want to include in the files that’s generated. You can read more about it here.   Initializr Although HTML5 Boilerplate provides a great foundation for starting HTML5 sites, it focuses on providing a starting shell structure (namely an html page, JavaScript files, and a CSS stylesheet) and doesn’t include much in the way of page content to get started with. Initializer builds on HTML5 Boilerplate and provides an initial test page that can be tweaked to meet your needs. It also provides several different customization options to include/exclude features. CSS3 Maker CSS3 provides a lot of great features ranging from gradient support to rounded corners. Although many of the features are fairly straightforward there are some that are pretty involved such as gradients, animations, and really any styles that require custom vendor extensions to use across browsers. Sure, you can type everything by hand, but sites such as CSS3 Maker provide a visual way to generate CSS3 styles. CSS3, Please! CSS3, Please! is a code generation tool that can be used to generate cross-browser CSS3 styles quickly and easily. All of the main things you can do with CSS3 are available including a clever way to visually generate CSS3 transform styles.       Ultimate CSS Gradient Generator CSS3 Maker (above) has a gradient generator built-in but my favorite tool for creating CSS3 gradients is the Ultimate CSS Gradient Generator. If you’ve created gradients in tools like Photoshop then you’ll love what this tool has to offer especially since it makes it extremely straightforward to work with different gradient stops. @font-face Fonts Although @font-face has been available for awhile, I think fonts are cool and wanted to mention a site that provides a lot of font choices. When used correctly fonts can really enhance a page and when used incorrectly (think Comic Sans) they can absolutely ruin a page. Several sites exist that provide fonts that can be used with @font-face definitions in CSS style sheets. One of my favorites is Font Squirrel.   HTML5 & CSS3 Support and Tests Interested in knowing what HTML5 and CSS3 features a given browser supports? Want to know how various browsers stack up with each other as far as HTML5/CSS3 support. Look no further than the HTML5 & CSS3 Support page or the HTML5 Test page.   CSS3 Easing Animation Tool CSS3 animations aren’t widely supported across browsers right now (I’m not really using them at this point) but they do offer a lot of promise. Creating easings for animations can definitely be a challenge but they’re something that are critical for adding that “professional touch” to your animations. Fortunately you can use the Ceaser CSS Easing Animation Tool to simplify the process and handle animation easing with…...ease.   There are several other online tools that I like but these are some of the ones I find myself using the most. If you have any favorite online tools that simplify working with HTML5 or CSS3 let me know.     For more information about onsite or online training, mentoring and consulting solutions for HTML5, jQuery, .NET, SharePoint or Silverlight please visit http://www.thewahlingroup.com.

    Read the article

  • how to target css to iPad but exclude Safari 4 desktop using a media query?

    - by miriam835work
    I am trying to use a media rule to target css to iPad only. I want to exclude iPhone/iPod and desktop browsers. I would like to to also exclude other mobile devices if possible. I have used <style type="text/css" media="only screen and (min-device-width: 768px) and (max-device-width: 1024px)"> but just found out that desktop Safari 4 reads it. I have tried variations with "481px" instead of "768px" and another that adds an orientation to that: <style type="text/css" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)"> but not luck. (Later we will be sniffing user-agent strings for iPad, but for now that solution won't work.) Thanks!

    Read the article

  • Using CSS to both scale AND reposition an image WITHIN a div?

    - by pbarney
    We know how to use CSS to show only part of an image within a div (i.e., image sprites), but the image has to be a background image. We know how to use CSS to scale an image, but the image has to be an IMG. Does anyone know of a way to scale and image and show only part of it? For example, I want to: show pixels (15,15) through (100,100), and scale it up by 200%. The first I can do by making in a background image. The second I can do by making it a foreground image. But so far, I have not ascertained how to do both. Is it even possible using only CSS/HTML?

    Read the article

  • How to return dynamic CSS with ASP.NET MVC?

    - by Morten Mertner
    I need a solution that lets me accomplish the following: Returning CSS that is dynamically generated by an action method Choosing CSS file depending on request parameter or cookie Using a tool to combine and compress (minify) CSS I am currently considering why there is no CssResult in ASP.NET MVC, and whether there might be a reason for its absence. Would creating a custom ActionResult not be the best way to go about this? Is there some other way that I've overlooked to do what I need? Any other suggestions or hints that might be relevant before I embark on this task will also be appreciated :)

    Read the article

< Previous Page | 82 83 84 85 86 87 88 89 90 91 92 93  | Next Page >