<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Benjamin Ashcroft &#187; CSS</title>
	<atom:link href="http://www.benjaminashcroft.com/tag/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.benjaminashcroft.com</link>
	<description>Manchester based web developer and designer of high quality websites, printed matter and moving images.</description>
	<lastBuildDate>Thu, 24 Jun 2010 13:33:28 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Datatables slide and select property finder</title>
		<link>http://www.benjaminashcroft.com/web-design/datatables-slide-and-select-property-finder/.</link>
		<comments>http://www.benjaminashcroft.com/web-design/datatables-slide-and-select-property-finder/.#comments</comments>
		<pubDate>Wed, 02 Sep 2009 23:03:05 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[datatables]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[jquery ui]]></category>
		<category><![CDATA[mysql]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[slider ui]]></category>
		<category><![CDATA[tables]]></category>
		<category><![CDATA[wearehome]]></category>
		<category><![CDATA[xml]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=130</guid>
		<description><![CDATA[Had a very busy few weeks learning how to use Mysql, PHP, XML and jquery. To create a dynamic property listing page with a dynamic slider. Have a play here. Makes extensive use of the Jquery Slider ui and Datatables plugin. Feeding off my first Mysql database, that in turn is populated by an xml [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.wearehome.com/fractional-ownership-slider.php"><img src="http://www.benjaminashcroft.com/wp-content/uploads/2009/09/Picture-2-299x191.png" alt="Slide and select" title="Slide and select" width="299" height="191" class="alignleft size-medium wp-image-131" /> </a> Had a very busy few weeks learning how to use Mysql, PHP, XML and jquery. To create a dynamic property listing page with a dynamic slider. Have a play <a href="http://www.wearehome.com/fractional-ownership-slider.php">here</a>. </p>
<p>Makes extensive use of the Jquery Slider ui and <a href="http://www.datatables.net/">Datatables</a> plugin.  Feeding off my first Mysql database, that in turn is populated by an xml file. All ive got to do now is tie the rest of the site into the new pricing database.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/web-design/datatables-slide-and-select-property-finder/./feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Editor that supports HTML 5 &amp; CSS 3</title>
		<link>http://www.benjaminashcroft.com/web-design/editor-that-supports-html-5-css-3/.</link>
		<comments>http://www.benjaminashcroft.com/web-design/editor-that-supports-html-5-css-3/.#comments</comments>
		<pubDate>Mon, 20 Jul 2009 23:01:32 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS 3]]></category>
		<category><![CDATA[Dreamweaver]]></category>
		<category><![CDATA[Hand Coding]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Notepad]]></category>
		<category><![CDATA[Smultron]]></category>
		<category><![CDATA[Syntax]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=108</guid>
		<description><![CDATA[Lots of people are wondering when Dreamweaver and others of that ilk will update to support HTML5 and CSS3. Sadly not for a while, if your riding the crest of the latest and greatest in web the commercial applications are not going to being cutting edge. Luckily neither HTML5 or CSS3 are going to be [...]]]></description>
			<content:encoded><![CDATA[<p>Lots of people are wondering when Dreamweaver and others of that ilk will update to support HTML5 and CSS3.</p>
<p>Sadly not for a while, if your riding the crest of the latest and greatest in web the commercial applications are not going to being cutting edge. Luckily neither HTML5 or CSS3 are going to be full implemented for a long time. Considering its only supported by minimal browsers.</p>
<p>Your best bet is cracking open you text editer and getting freindly with the source.<br />
My weapon of choice is <a href="http://tuppis.com/smultron/">Smultron</a> its a great little mac text editor with syntax highlighting. A Good place to start to learn HTML 5 would be <a href="http://www.w3schools.com/tags/html5.asp">here</a>.</p>
<p> <script src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_GB" type="text/javascript"></script><script type="text/javascript">FB.init("f1d016e6d7bdda3cbbd50d1b28c359ee");</script><fb:fan profile_id="115765761158" stream="1" connections="" width="500"></fb:fan>
<div style="font-size:8px; padding-left:10px"><a href="http://www.facebook.com/pages/Hand-Coding/115765761158">Hand Coding</a> on Facebook</div>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/web-design/editor-that-supports-html-5-css-3/./feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>A Flexible Automatic Jquery gallery.</title>
		<link>http://www.benjaminashcroft.com/web-design/a-flexible-automatic-jquery-gallery/.</link>
		<comments>http://www.benjaminashcroft.com/web-design/a-flexible-automatic-jquery-gallery/.#comments</comments>
		<pubDate>Mon, 20 Jul 2009 16:35:10 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[code]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[easing]]></category>
		<category><![CDATA[fancybox]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[images]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[pikachoose]]></category>
		<category><![CDATA[slider.js]]></category>
		<category><![CDATA[snippet]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=91</guid>
		<description><![CDATA[I&#8217;ve been working on site recently which features a number of galleries in lightboxes. Using the fancybox lightbox plugin it launches an iframe with the gallery. I highly recomend the Pikachoose gallery simple for its amazing simplicity and ease of use. Easy to style and adapt to my own needs, including a inbuilt carousel feature [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve been working on site recently which features a number of galleries in lightboxes. Using the fancybox lightbox plugin it launches an iframe with the gallery. </p>
<p>I highly recomend the <a href="http://pikachoose.com/demo/">Pikachoose</a> gallery simple for its amazing simplicity and ease of use. Easy to style and adapt to my own needs, including a inbuilt carousel feature utilizing slider.js.<em> I&#8217;ll post a link to an example lightbox gallery soon.</em></p>
<h2>List images from a folder automatically via PHP</h2>
<p>Heres a little code snippet I used to list all the images in a folder.</p>
<pre name="code" class="php">

// the directory, where your images are stored
$imgdir = '/images/'; 

// list of filetypes you
$allowed_types = array('png','jpg','jpeg','gif'); want to show

$dimg = opendir($imgdir);
while($imgfile = readdir($dimg))
{
 if(in_array(strtolower(substr($imgfile,-3)),$allowed_types))
 {
  $a_img[] = $imgfile;
  sort($a_img);
  reset ($a_img);
 }
}
// total image number
$totimg = count($a_img); 

for($x=0; $x < $totimg; $x++)
{
 $size = getimagesize($imgdir.'/'.$a_img[$x]);

 // do whatever
 $halfwidth = ceil($size[0]/2);
 $halfheight = ceil($size[1]/2);
 echo '
<li><img src="'.$imgdir.''.$a_img[$x].'"/></a></li>

';
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/web-design/a-flexible-automatic-jquery-gallery/./feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>SEO freindly font replacement = Pretty Letters</title>
		<link>http://www.benjaminashcroft.com/web-design/seo-freindly-font-replacement-with-out-the-flash/.</link>
		<comments>http://www.benjaminashcroft.com/web-design/seo-freindly-font-replacement-with-out-the-flash/.#comments</comments>
		<pubDate>Tue, 30 Jun 2009 19:54:08 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Canvas]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Cufon]]></category>
		<category><![CDATA[Font Generator]]></category>
		<category><![CDATA[Font Replacement]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[SEO Freindly]]></category>
		<category><![CDATA[Sifr]]></category>
		<category><![CDATA[Text]]></category>
		<category><![CDATA[Typography]]></category>
		<category><![CDATA[W3C]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=53</guid>
		<description><![CDATA[In the past, when i&#8217;ve needed to expand from the normal range of web fonts. Ive relied on Sifr to replacement the web text with nice pretty flashy fonts. The problem was this solution was a bit fiddly and had to rely on flash. Leaving me with a labourus task of manually image-replacing headers and [...]]]></description>
			<content:encoded><![CDATA[<p>In the past, when i&#8217;ve needed to expand from the normal range of web fonts. Ive relied on <a href="http://www.mikeindustries.com/blog/sifr/">Sifr</a> to replacement the web text with nice pretty flashy fonts. The problem was this solution was a bit fiddly and had to rely on flash. Leaving me with a labourus task of manually image-replacing  headers and so on, with my powers of css.</p>
<p>Recently on a new project a great piece of work was brought to my attention. A great javascript based text replacement solution called <a href="http://wiki.github.com/sorccu/cufon/demos">Cufon</a>. Simply put, its great. Very little effort to intergrate, even less effort to control. Not even that much slow down on page load. </p>
<p>Visit <a href="http://wiki.github.com/sorccu/cufon/about">here to get the lowdown</a></p>
<p>As its javascript and kicks after the page loads, it degrades gracefully if not supported. As well as  leaving all the juicy web text for the web spiders to nibble on. </p>
<p>The only thing to be wary of is licensing issues, but hey check out this <a href="http://www.cameronmoll.com/articles/cufon/">great example of Cufon in action. </a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/web-design/seo-freindly-font-replacement-with-out-the-flash/./feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Developing the Dubai dream.</title>
		<link>http://www.benjaminashcroft.com/dubai/bay-central-dubai-marina-website/.</link>
		<comments>http://www.benjaminashcroft.com/dubai/bay-central-dubai-marina-website/.#comments</comments>
		<pubDate>Thu, 19 Mar 2009 16:26:42 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Dubai]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Bay Central]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Developing]]></category>
		<category><![CDATA[Dubai Marina]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Launch Site]]></category>
		<category><![CDATA[Real Estate Website]]></category>
		<category><![CDATA[Select Property]]></category>
		<category><![CDATA[Skyscraper City]]></category>
		<category><![CDATA[Web Standards]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=28</guid>
		<description><![CDATA[Even in Dubai big things start small, where things don&#8217;t get much bigger Take a look howcasing Bay Central, at the heart of Dubai Marina. Completed late 2007 for the launch of this iconic development for Select Property. Initial concept by Andy Monks, Custom Javascript by Colin Rotherham, Design &#38; Code by Benjamin Ashcroft. Development [...]]]></description>
			<content:encoded><![CDATA[<p>Even in Dubai big things start small, where things don&#8217;t get much <a title="bigger is better" href="http://www.flickr.com/photos/danielcheong/" target="_blank">bigger</a></p>
<p>Take a look howcasing Bay Central, at the heart of Dubai Marina. Completed late 2007 for the launch of this iconic development for Select Property. Initial concept by Andy Monks, Custom Javascript by Colin Rotherham, Design &amp; Code by Benjamin Ashcroft.<br />
<a href="http://www.selectproperty.com/">Development by Select Property.</a></p>
<p>Please click here to find the archived version of the <a title="Bay Central Dubai Marina" href="http://www.benjaminashcroft.com/archive/bc/">Bay Central Website.</a></p>
<p>For all the latest information on properties in <a title="Dubai Property" href="http://www.selectproperty.com/invest/dubai/">Dubai Marina</a> visit <a title="Overseas Property Investment" href="http://www.selectproperty.com">www.selectproperty.com</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/dubai/bay-central-dubai-marina-website/./feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Designing a design portfolio&#8230;</title>
		<link>http://www.benjaminashcroft.com/web-design/designing-a-design-portfolio/.</link>
		<comments>http://www.benjaminashcroft.com/web-design/designing-a-design-portfolio/.#comments</comments>
		<pubDate>Tue, 10 Mar 2009 18:13:54 +0000</pubDate>
		<dc:creator>Benjash</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Graphic Design]]></category>
		<category><![CDATA[Opensource]]></category>
		<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[Wordpress Themes]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.benjaminashcroft.com/?p=13</guid>
		<description><![CDATA[Portfolio WPESP theme Example WPESP Design Portfolio This is a great example of a WordPress powered design portfolio. WPESP Portfolio is fully integrated into WordPress along with a great &#8220;Coda style&#8221; featured work pane. Aesthetically the theme is minimal and visually appealing. Overall i find it a bit grey for my liking, the rounded corners [...]]]></description>
			<content:encoded><![CDATA[<p><strong>Portfolio WPESP theme </strong><a title="WPESP Design Portfolio" href="http://www.wpesp.com">Example WPESP Design Portfolio</a></p>
<p>This is a great example of a WordPress powered design portfolio. WPESP Portfolio is fully integrated into WordPress along with a great &#8220;Coda style&#8221; featured work pane. Aesthetically the theme is minimal and visually appealing. Overall i find it a bit grey for my liking, the rounded corners on the images also take away from the design. Yet with a bit of tweaking this theme could be turned into a design portfolio with a lot of personality.</p>
<p>More: <a title="WPESP Design Portfolio" href="http://www.wpesp.com" target="_blank">WPESP Portfolio WordPress Theme<br />
</a></p>
<p><strong>Viewport </strong><a title="Viewport Design Portfolio" href="http://labs.paulicio.us/viewport/" target="_blank">Example Viewport Design Portfolio</a></p>
<p>http://paulicio.us/2008/11/05/viewport-a-free-wordpress-theme/</p>
<p><strong>Sharpfolio 2</strong> <a title="Sharpfolio Design Portfolio" href="http://webrevolutionary.com/sharpfolio-demo/" target="_blank">Example Sharpfolio Design Portfolio</a></p>
<p>http://www.indexhibit.org/</p>
]]></content:encoded>
			<wfw:commentRss>http://www.benjaminashcroft.com/web-design/designing-a-design-portfolio/./feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
