Back To Competitions

CSS Competition #1: Ozzu Look and Feel

Post November 12th, 2007, 2:10 pm

righteous_trespasser wrote:
Okay here is another question ...
Am I allowed to put my own images in there then ... ? or how do you want it to be?


Nope, sorry. As far as the discussions the mods had, no images can be inserted. You're going to have to margin or pad off the left and use a background images. Or come up with some really creative solution. :)

That's really what this competition is all about - creative solutions.
###
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post November 12th, 2007, 2:10 pm

  • Bogey
  • Ounce of 'Zu'
  • Web Master
  • User avatar
  • Joined: 14 Jul 2005
  • Posts: 4671
  • Loc: Ozzu
  • Status: Offline

Post November 12th, 2007, 6:09 pm

righteous_trespasser wrote:
Okay here is another question ... In the sample code you gave us there is the following:
Line number On/Off
Code: Select all
<div id="forumIcons">
<ul>
<li><label>New posts</label></li>
<li><label>No new posts</label></li>
<li><label>Forum is locked</label></li>
</ul>
</div>

And at the same place in the real ozzu site there is the following:
Line number On/Off
Code: Select all
<div id="forumIcons">
<ul>
<li><img src="templates/light/images/folder_new.gif" alt="New posts"><label>New posts</label></li>
<li><img src="templates/light/images/folder.gif" alt="No new posts"><label>No new posts</label></li>

<li><img src="templates/light/images/folder_lock.gif" alt="Forum is locked"><label>Forum is locked</label></li>
</ul>
</div>

Am I allowed to put my own images in there then ... ? or how do you want it to be?


don't know... in the rules they said that we have to use the HTML provided... maybe they want to keep those images constant? After all, this IS a CSS competition.
My Developing Blog (7)
Wedevoy.com - In Development... should be done in about a week or so
  • joebert
  • Packaging Tape
  • Genius
  • User avatar
  • Joined: 10 Feb 2004
  • Posts: 8662
  • Loc: Clearwater, FL
  • Status: Online

Post November 12th, 2007, 9:11 pm

For anyone wondering about images, it can be done without altering the HTML, as seen here.

The only major difference is that you'll be linking to actual image files in the CSS like this
Line number On/Off
Code: Select all
div#headerNav a:link, div#headerNav a:active, div#headerNav a:visited {
   background-image: url("a-visited-background.png");
}


instead of using the "data:" protocol to embed the images directly into the stylesheet like this
Line number On/Off
Code: Select all
div#headerNav a:link, div#headerNav a:active, div#headerNav a:visited {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAGCAYAAAAPDoR 2AAAAQElEQVR42k3MoQ1AUQhD0U6DQSAYA8Hib6f/U0RTcRMOJOAB3+4qNwg2M5cb3a0FZ zeqSuDs1tvMvNx3jAjl/gFO8kg6Ly7NFwAAAABJRU5ErkJggg==") !important;
}

as I did in that example.
Internet Explorer doesn't support the "data:" protocol.

It's not a bad idea to take a look at that examples' CSS before you start on your own entry, & possibly during development if you get stuck.

Also in case anyone's wondering, I do not plan on entering that example, even tweeked to follow the contests rules, into this competition.
I'd feel like I cheated since I've technically had an extra 6 months to develop my entry.
Error: 0xC0FFEE is empty

Post November 12th, 2007, 9:15 pm

joebert, you are a BAMF!
###
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Joined: 28 May 2003
  • Posts: 19509
  • Loc: Pittsburgh PA
  • Status: Offline

Post November 13th, 2007, 6:39 am

righteous_trespasser wrote:
Okay here is another question ... In the sample code you gave us there is the following:
Line number On/Off
Code: Select all
<div id="forumIcons">
<ul>
<li><label>New posts</label></li>
<li><label>No new posts</label></li>
<li><label>Forum is locked</label></li>
</ul>
</div>

And at the same place in the real ozzu site there is the following:
Line number On/Off
Code: Select all
<div id="forumIcons">
<ul>
<li><img src="templates/light/images/folder_new.gif" alt="New posts"><label>New posts</label></li>
<li><img src="templates/light/images/folder.gif" alt="No new posts"><label>No new posts</label></li>

<li><img src="templates/light/images/folder_lock.gif" alt="Forum is locked"><label>Forum is locked</label></li>
</ul>
</div>

Am I allowed to put my own images in there then ... ? or how do you want it to be?


In this competition images are only permitted via CSS.
To win this competition you shouldn't even be looking at current OZZU code. The idea is to come up with something unique and different via style and style only.

Post November 13th, 2007, 10:57 pm

Okay coolio ... thanks guys ... Mine is coming along really nicely imo ... this competition is going to be awesome ... for a sample of what I have so long, check out this ...
</thats_what_she_said>
  • Breeze
  • Expert
  • Expert
  • User avatar
  • Joined: 22 Apr 2007
  • Posts: 704
  • Loc: Australia
  • Status: Offline

Post November 13th, 2007, 11:10 pm

righteous_trespasser wrote:
Okay coolio ... thanks guys ... Mine is coming along really nicely imo ... this competition is going to be awesome ... for a sample of what I have so long, check out this ...


Berry goosenecks Mr RT, sir ... love the colours :D By the way, do you notice the word 'category' behind the links at the top?

Post November 13th, 2007, 11:24 pm

Okay, fixed ... I was so stressed about getting it to work in IE6 (Aaarggh!) that I forgot all about the rest ... Now I still have quite a bit to do, but the general concept is there ...
</thats_what_she_said>
  • Breeze
  • Expert
  • Expert
  • User avatar
  • Joined: 22 Apr 2007
  • Posts: 704
  • Loc: Australia
  • Status: Offline

Post November 13th, 2007, 11:33 pm

I want to take a fork and stab it into the face of IE6. In other news I am smitten with Firefox :D

I'm yet to start on mine. I have an idea for a colour sceme but I'm yet to decide which parts are gonna be that colour and those bits are gonna be the other colour.

Post November 14th, 2007, 1:56 am

I realize that the mods on this forum didn't all have math at school ...
Quote:
In total there are 1300 users online :: 100 Registered, 10 Hidden and 1300 Guests.

100+10+1300 <> 1300
...
100+10+1300 = 1410
</thats_what_she_said>

Post November 14th, 2007, 3:49 am

Yes, r_t, you are correct. When I "ipsum"-ifyed the page, I also changed the numbers to dummy information. If you could please overlook my meaningless insertion of random values, I would consider it a personal favor.
:)
###

Post November 14th, 2007, 3:55 am

lol ... ofcourse ...
</thats_what_she_said>
  • Breeze
  • Expert
  • Expert
  • User avatar
  • Joined: 22 Apr 2007
  • Posts: 704
  • Loc: Australia
  • Status: Offline

Post November 14th, 2007, 4:22 am

righteous_trespasser wrote:
Okay, fixed ... I was so stressed about getting it to work in IE6 (Aaarggh!) that I forgot all about the rest ... Now I still have quite a bit to do, but the general concept is there ...


I'm gonna be a pain in the backside and tell you that it's fine in firefox and doesn't work in IE7 :D

Post November 14th, 2007, 4:31 am

I'll check that when I'm at home ... it's tough working like this ... at work I've got IE6 and FF(local only) and at home I've got IE7 and FF ...
</thats_what_she_said>

Post November 14th, 2007, 4:52 am

Check Opera too.

Aside: Did you know that Opera was initially developed by the same guy (CTO of Opera) that was a huge part of developing CSS? ;)
###
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post November 14th, 2007, 4:52 am

1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13

Post Information

  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© Unmelted Enterprises 1998-2008. Driven by phpBB © 2001-2008 phpBB Group.

 
 
 
 

Need a pre-made web design for your website?

Check out our templates here: Ozzu Templates


400+ FREE Website Templates. Download Now!