lucidfanart

Brand New Layout

Hi everyone. Not sure if anyone still visits Lucid Fanart but I’ve been working on a new layout for a while I’ve got the design down and I’ve started coding it (twice) but if you’ve been hanging around Lucid Fanart you may have noticed the layout change to a default layout.

I’m having a little bit of an issue with some plugins so I’ve simply turned them off for now but this means that the old layout wont work and there isn’t any real reason for me to fix it since I’ve started a new layout which I want to get round to finishing some point this year lol.

I’ve done a few new pieces of art work which you can see below and there is also a sneaky peak at the new layout.

lucidfanart

thedoctor

Lucid Fanart Surprise Awards

july13Even though I haven’t updated in a while there are some amazing people out there who are still thinking of me and Lucid Fanart :) I’d like to thank Brittany at All Night Noise for making Lucid Fanart site of the month for July 2013 and check out my beautiful award. Also while I’m at it I should mention that the AFA awards were good to me this year as well I somehow managed to get 15 awards it was a great night and so many beautiful awards were given out and I feel honoured that I managed to get some of them. I hope everyone else had a great night and and congratulations to everyone who participated and lets hope for another great one next year.

Thanks to the AFA awards I’ve started doing some art work again and even started rebuilding lucid fanart I’ve got some cool looking designs, I’ve just got to piece it together, it may take a while as I’m making it responsive, and combining the two programs I use to run Lucid Fanart into one. So hopefully soon I’ll be able to show you a brand new site. But for now how about some brand new artwork.

gemini-lannistersdemondean

slayers-and-vampires

thedoctor

clearfix-example

The Clearfix

You may be wondering what the hell a clearfix is? Well quite simply its a better way of doing clear:both. Its fool proof and works in all browsers, and if you’re not sure what clear:both does, it basically puts a full stop after any floating div.

I see it a lot of the times on forums where people are having problems with their layouts or with the new staff at my work its generally the first thing we have to teach them, there are many problems that can occur when you apply floating div’s but 9 times out of 10 the clearfix will fix it! That’s how fool proof it is. If you can remember to use this you will find that coding sites will be much easier.  Below is an example of the most basic error so you can see what I mean.

Clearfix Eample

Live Preview [opens in new window]

So you must be thinking if this clearfix fixes so many problems it must be a pretty hefty piece of code, well no its really simple actually:

.clearfix:after { content:'.'; display:block; height:0; clear:both; visibility:hidden }
.clearfix { display:inline-block }
* html .clearfix { height:1% }
.clearfix { display:block }

That is all it is! Its CSS so its cross browser compatible, which if you’re in the web design industry you will find everything needs to be these days as you can see there are several different rules, these are as the first one .clearfix:after won’t be accepted by all browsers so there are separate rules that if all else fails the other rules will work.

There is even a shorter version but this hasn’t been tested on ie6 but it works all the way down to ie7 so if you’re like me and don’t really care about the people using ie6 as if they can’t update their browser they shouldn’t be on the internet (either because they are at work or they obviously don’t care about the quality of the websites they visit) you can use the code below.

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

Ok so we know what we need to put into the style sheet but if you don’t put it in your markup correctly it’s just not going to work, so to make sure we know how to put it into the markup we need to understand what it does.

Like I said above what you are basically doing is putting a full stop after all the floating div’s that are causing you problems, to illustrate this I’ve mocked up a problem I’ve seen in the past and generally the most common problem.  Where you can see the wrapper div doesn’t fully extend the two floating div’s. You may think it’s not a problem now, but if you wanted to add a footer or add a background to the wrapper div you’re going to have a problem.

By simply adding the class of clearfix to the surrounding div you can see that the div now extends around the entire layout which is great if you want to create sections to sites you can clearly define the area while not being limited to what you can do within the area.

I have created a wireframe of the homepage of Lucid Fanart to show you how it would look without the clearfix and the simple css has saved me a lot of time, and a lot of screwy hacks trying to make everything fit into the space perfectly. As you can see from the example the dark black lines are the areas where I’ve put the clearfix and you can see a difference in the way everything lines up I haven’t even set positions on things I’ve simply written out the markup and done a few lines of CSS and it simply falls in to place.

Clearfix Lucid Fanart Example

Live Preview [opens in new window]

I hope you found this tutorial useful and that you are able to use the clearfix, if you need any help please post below and I’ll talk you through it, if you have an example please add it in and I’ll try and help specifically to your design.

How Slack am I!

Yikes its been a while! I have been around and slowly updating my site, as you can see I have some new wallpapers on my latest additions section, and I have some wonderful new affiliates you totally need to checkout! I’ve been pretty busy at work lately and coming home to the pc hasn’t been very appealing but I wanna get back into it again. Thinking about redoing the layout? I’ve been learning a lot about wordpress at work and kinda wanna put it into a new theme here but I do like the current one. I have nothing in mind for the design but a few things in mind for the coding… So question do you guys wanna see a new layout? if so comment below ;)

I also want to thank Destiny, FioNat and Sasha for the beautiful Halloween Gifts… yet another thing I slipped up on :( I will be doing a Christmas gift for everyone though so I can make up for it with that :) I am taking some time off soon and I think I’m gonna use the time to work on some things.

I mentioned above I have some wicked new affiliates check them out.

  • flowers for a ghost
  • brutal affection
  • Broken Innocence
  • Don't Fade Away
  • Selfish Ways
and I have some new wallpapers which I’ve won awards for! yay check out my awards page
  • Home: Prove It
  • Forever that's the Whole Point
  • Pylea Hero's
  • To Serve and Protect
  • Saint

Awards!!!!

Holy crap! so many awards!!. If you didn’t know the AFA 2011 ceremony happened a few weeks ago and can I say it was so much fun! I got to talk to people I’ve admired for a long time in the fanart world (all be it online it wasn’t a physical thing) and I also got a lot of fantastic awards! I said something during the ceremony that I think sums up how amazing the awards have been.

its difficult sometimes especially in my job doing art work for really boring things like… wire products (yes I said wire) among other really boring things (I’m sure most of you are in a similar boat), and then come back and work on other art work even if it is enjoyable it can still become a chore doing it all day and evenings, but I have to say the AFA awards have given me such a boost in confidence and drive! and Ehlwyen I’m so glad I got back into Buffy Forums its been such a help for my inspiration and education, I have to say I rely a lot on you guys for inspiration especially with the forum challenges and giving me a reason to keep going with the art work if it wasn’t for Buffy Forums and the community here I probably would have packed it in years ago!!!!

and I’m totally with you Amber there were a few artists I didn’t know about before the AFA such as Xinyi, Sophie, Clement, and JJ to name a few but I’ve saved all their art work and got it on my wallpaper rotator I’m so glad I joined in the AFA this year its been really uplifting and I hope everyone feels the same way. so thank you SayJay for brining us all together and enhancing the already fantastic Buffy Forums Art Community!
Demetreas (aka me)

Not only have I won lets count…:16!!! awards!! I got an email today from SayJay at Radiance a website I’ve stalked for god knows how long and I’ve been.. lol I say I’ve been my site has been awarded site of the month! I just hope everyone knows how much I appreciate the consideration for these awards! and I don’t want it to go to my head but its been a great couple of weeks for me in the art world I just have to keep it up!

Site of the Month July 2011

check out all my amazing awards I received from AFA 2011:

10th Best overall artist!!!!!!!!!!!!!!!

2nd place Vampire group
3rd place Sup/Fan character
4th place Techniques: Text
7th place Sup/Fan episodic
7th place Techniques: Stocks
8th place Celeb: Male
10th place Sci-Fi episodic
10th place Vampire character
10th place Emotions: Drama
14th place Techniques: Colour
RU place Vampire episodic
RU place Emotions: Love
RU place Techniques: Manip

[nggallery id=11]

I also wanted to give a little update on what I’ve been working on I noticed I’ve not been doing that lately I’ve just been doing site of the month which is on hold this month as I wanna do more artwork.

  • Echo
  • Sookie & Eric
  • I Am Number 6
  • Bones
  • Demetreas
  • I Wish You Were Here

June SOTM Beyond Hope

I have a brand new site of the month, I know I missed last month, sorry but I have had a lot on at work, I’ve just set live a HUGE site that I’ve been working my ass off to get live and I’ve not had much time for other thing, not to mention lacking in inspiration as its all been sucked out in the office.

I hope to be making some more artwork soon I keep looking at the Buffy Forums Challenges and they all look great I’ve started walls several times but I keep running out of steam :( but I wanted to keep up to date so here is my SOTM for June

Beyond HopeReason: For June, I have decided to make Beyond Hope my site of the month. Beyond Hope is a beautiful site with lot of detail and care taken with it. I love the layout that is currently up on the site, some of my favourite actresses feature in this layout but I think best of all this layout draws in so much detail [read more]

April SOTM Shadow of the Day

I missed last month, been really busy with work, and what with getting the new layout live been super busy. but gave me a chance to get a head start this month ;) I have awarded Shadow of the Day as Lucid Fanart’s site of the month.

April 2011 Shadow of the Day

Reason: I’m totally loving Shadow of the Day at the moment, not only does Marilyne have an amazing site, the layout she has to her site always has consistency which I find important with a site, the navigation is really easy to follow, and the designs are always really delicate and well thought out. She has a real flare for Merlin art work… [Read More]

I’ve also been awarded site of the month at two sites last month and this month, I am so proud get get these awards. Last month Christine from Surrender Your Soul awarded me site of the month check out my cute twilight style award. And this month the wonderful Brittany has awarded Lucid Fanart as site of the month and look at my awesome Being Human USA award.

It has been a fantastic month for me not only did I get the two awesome site of the month awards, but I got some art awards over at Buffy Forums. I got Honourable Mention over at the Angelogy challenge for my Legend of the Seeker wallpaper Angel of Death. I have also got 1st Place W00T! for my Angel Poster.

As you can see my last post was a tutorial, I was actually quite surprised when I saw my poll that a lot of you wanted to see more tutorials. I personally think I suck at making tutorials but I’ll try my best. I’m gonna work my way through the Adjustment Layers for Photoshop tutorials, and maybe add in a few wallpaper tutorials when I make new wallpapers I find it difficult to go back and redo wallpapers becuase a lot of the time I just do trial and error its the only advice I give people really play with photoshop and you can’t go wrong.

Not sure what kind of HTML and CSS or PHP tutorials I can give you but if you guys have any ideas or if there is anything you’ve seen on my site you would like to try for yourself just make a note of it in my comments and I’ll make a tutorial on it.