S*ds Law! Looks like FF (at least) doesn't honour self closing <a>'s. See mod below On Mon, 02 Oct 2006 21:06:50 +1300 Steve Holdoway <[EMAIL PROTECTED]> wrote:
> On Mon, 25 Sep 2006 13:46:23 +1200 > Andy Leach <[EMAIL PROTECTED]> wrote: > > > I wonder if ImageMagick can convert text > > > to image using a particular font? There goes my afternoon... > > > > > > cheers, > > > > > > Andy > > > > Sorry for replying to myself, didn't take quite as long as thought! > > > > convert -size 200x30 xc:transparent -font Arial.ttf -fill black > > -pointsize 12 -draw "text 5,15 '[EMAIL PROTECTED]'" addr.png > > > > from http://ask.metafilter.com/mefi/44736 > > > > Cheers, > > > > Andy > Thanks, I've used this for the menus... using css, a: pseudo classes and > background images to emulate the text highlighting. Had to work that bit out > myself - I've never seen it used anywhere. > > If anyone's interested, ( w3c compliant ) Menu bar at top right of screen. > Each button is a 150x30 pix image. Display the 'on' button as an image for > the selected page... image swapping with no javascript - can't be that bad! > > the css... > div.menubar > { > margin-top: 22px; > float: right; > height: 30px; > } > div.menubar ul > { > padding: 0; > margin: 0; > border: 0; > } > div.menubar ul li > { > float: left; > list-style-type: none; > text-decoration: none; > padding: 0; > margin: 0; > border: 0; > width: 150px; > height: 30px; > } > div.menubar ul li a > { > display: block; > text-decoration: none; > height: 30px; > } > div.menubar ul li a.home, div.menubar ul li a.home:link, div.menubar ul li > a.home:visited > { > background: #ebcf89 url(/images/buttons/home-off.png) no-repeat; > } > div.menubar ul li a.home:hover, div.menubar ul li a.home:active > { > background: #ebcf89 url(/images/buttons/home-on.png) no-repeat; > } > div.menubar ul li a.home, div.menubar ul li a.mens:link, div.menubar ul li > a.mens:visited > { > background: #ebcf89 url(/images/buttons/mens-off.png) no-repeat; > } > div.menubar ul li a.mens:hover, div.menubar ul li a.mens:active > { > background: #ebcf89 url(/images/buttons/mens-on.png) no-repeat; > } > div.menubar ul li a.womens, div.menubar ul li a.womens:link, div.menubar ul > li a.womens:visited > { > background: #ebcf89 url(/images/buttons/womens-off.png) no-repeat; > } > div.menubar ul li a.womens:hover, div.menubar ul li a.womens:active > { > background: #ebcf89 url(/images/buttons/womens-on.png) no-repeat; > } > div.menubar ul li a.contact, div.menubar ul li a.contact:link, div.menubar ul > li a.contact:visited > { > background: #ebcf89 url(/images/buttons/contact-off.png) no-repeat; > } > div.menubar ul li a.contact:hover, div.menubar ul li a.contact:active > { > background: #ebcf89 url(/images/buttons/contact-on.png) no-repeat; > } > > And the html snippet ( home page selected )... > > <div class="menubar"> > <ul> > <li><img src="/images/buttons/home-on.png" alt="Home" /></li> > <li><a class="mens" href="/mens.html" /></li> > <li><a class="womens" href="/womens.html" /></li> > <li><a class="contact" href="/contact.html" /></li> > </ul> > </div> (This works correctly) <div class="menubar"> <ul> <li><img src="/images/buttons/home-on.png" alt="Home" /></li> <li><a class="mens" href="/mens.html"></a></li> <li><a class="womens" href="/womens.html"></a></li> <li><a class="contact" href="/contact.html"></a></li> </ul> </div> > > > I'm sure those who really know what they're talking about could improve > dramatically ( almost certainly don't need the active class )... maybe I > should patent it first (: > > > Cheers, > > Steve
