Fixed

June 27th, 2010, under Website. 0 comments.

CSS4! HTML5! Fixed sidebars! Large font! Lucinda Grande! Hover effects! Text-shadow! Image-free! Pink, blue, purple, and grey!

In this layout I included some of my favorite trends using CSS4. I got a little crazy with webkit properties because not having to break out Photoshop or Javascript to add a little flourish to my navigation is really easy and unfussy. And yeah, check out that hover. I spent most of my time editing the in-out transitions and I really hope you have a browser that supports CSS4 (erm, I’ve yet to add the moz properties, so Mozilla users, sit tight).

I fiddled with PHP to integrate Asides and I’m surprised my alternative to Matt Mullenweg’s method didn’t break my site. I used much simpler code and only had to tweak my css a bit to hide the titles and meta data.

<div class="entry <?php if ( in_category(7)) { ?> aside<?php } ?>" id="post-<?php the_ID(); ?>">
<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
<div class="meta"><span><?php the_time('F jS, Y') ?></span>, under <a href="category"><?php the_category(', ') ?></a>. <?php comments_popup_link('0 comments', '1 comment', '% comments'); ?>. <?php edit_post_link('Edit.', '', ' '); ?></div>

<?php if ( in_category(7)) { ?><span class="left"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_time('m/d/y') ?></span></a><?php } ?><?php the_content('Read the rest of this entry &raquo;'); ?>

Write A Comment