olivier

LOL

pas de problem mon ami! vavavoum

you are too kind

lol So first they

Firebug takes a bit to get your head round but it absolutely rocks!

I have a strong french accent I think but I work at it not always easy Ask Ben what I sound like, we work together

I agree! I love firefox for that, It's so cool to be able to customise the browser like that. You should get a mac and then you could play with dashboard widget as well as FF extension

Colchester is pretty cool, nice to hear you're form colchester too japjake. I have to admit a little something tho... I'm French so I'm only a resident not a native as our dear Ben.

firebug is a must have too if you are into development

decided to make...

you 2 are so polite, I admire you

Bienvenue

hiya I've had a play with your SS again. Have a look there and let me know it works now... If it does, the code is attached, if not, let me know and i'll have another go. I have commented the stylesheet so that you understand some of the changes. your doctype was wrong which puts IE in quirck mode straight away. Anyway, hopes this helps lambada.zip (this is only the front page index.html + css)

It's a bit difficult to explain without doing things... I don't know what sort of content you were planning on putting on that right side but maybe break down your posts into categories and display the available categories on the right side. You can display the most popular post as a little list too... A flickr feed if you have photos you can post on flickr... that sort of thing... about the style, keep it in line with what you have there, it looks good to me! I might open a debate there but the "web 2.0" thing is really about what your site does and not the way it looks! although the trend at the moment are gradient and bubbles and stuff what makes a good "2.0" to me is the CONTENT and the functionalities you can offer, look at something like tinyurl for example, not much style there but what a cool app! You're running a blog/community and you offer syndication, you're doing your "2.0" bits Keep up the good work

I've just tried to lok at your page again for you but it's not there anymore Let me know if you still need help Oli

This phone runs OsX... no freeze there, trust me

I had a look at your css and I think I know what it is. #content { background-color: #000000; color: #FFFFFF; width: 76%; <-- try changing this to 75% or 74%, it should sort it float: left; margin-left: 2%; margin-right: 2%; border: 0px; } Let me know if this helps. If it doesn't I'll advice you to change your percentages to fix values. You are using a fix width for your container so really there's no reason to use %'s within it. Bonsoir

I agree with E and the fact that your intro is javascript means that if someone hasn't got javascript enabled, they won't see a thing...

Hello! So here's something that took me a long time to crack using css only and when i finally found the solution, I couldn't believe how simple it was!! If the title doesn't describe the technique well enough, let me clarify it for you. When visiting a website, I always find it really handy if the navigation reflects what page i'm currently on, i.e if you are on the "about us" page of a site for example, isn't it cool when the "about us" link in the navigation is highlighted or is different to the other ones to indicate that this is where you currently are...? Well, in theory, the a:active should do it for you, now I don't know about you but it never worked for me... So I use to use php to replicate the effect but I knew deep down that there was a way round it with css, and then I found it. Now I don't know if any of you use this. When writing semantic code, the goal is to use markup in a efficient way thus limiting the amount a pointless tags. One thing a lot of people don't think of is assigning an id (or class) to the <body> tag. Having an id on your body tag allow you some pretty cool stuff which I won't talk about in this post as it would be beside the point. However, adding an id to your <body> is the essence of this tutorial. So now... let's get coding! Create a new html page and paste the code below in it <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>tutorial 01</title> <link href="default.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body id="index"> <ul id="navigation"> <li class="index"><a href="index.html">index</a></li> <li class="page2"><a href="second_page.html">second page</a></li> <li class="page3"><a href="third_page.html">third page</a></li> </ul> </body> </html> Save this page as index.html now do file>save as re-save it as second_page.html but amend the <body> id to "page2" instead of "index" finally, repeat the operation(file>as) this time saving it as third_page.html and amend the <body> id to page3. So now you should have 3 .html document called respectively index.html, second_page.html and third_page.html. Next, create a new document and paste the code below: ul { list-style:none; } ul li a { color:#0066CC; } ul li a:hover { color:#cc0000; } #index #navigation .index a, #page2 #navigation .page2 a, #page3 #navigation .page3 a { color:#f4cb17; padding-left: 10px; text-decoration: none; } Now if you open you open index.html in your browser and click on each link, you'll see that the navigation reflects what page you are on. You can go here for a working example of this code. I could spend ages trying to explain the code but i'm sure it will speaks for itself however, if you need an explanation, give me a shout and I'll help you out Hope this will be helpful! Bonsoir Olivier

this is what i'd look like if I was in South Park you are pretty futuramistic yourself

I agree mr bEn

Yeah I did see the javascript version but as it relies on the user having javascript turned on, i thought the php alternative was pretty cool Nice piece of code tho Olivier

There you go! If you look in your "files" folder, there are 4 new images and a little amendment in your code(index.html), I'm sure you'll make sense of it yourself... If not, tell me and i'll explain it to you. This is not the best way for that sort of thing but as you use a table based template, this was the quickest way round it. Take it easy Olivier ballroombloodshed.zip

re style switcher, I got a really good script of the internet but unfortunately can't remember where from. This switcher works with session and/or cookies which allow the chosen style to stick from page to page so say if the user selects what style they want on one page, when they navigate through the site, the style they've chosen is kept in a session or a cookie. The code was something like this: this should be saved as a include called style_array.php <? $styleSheets = array(); // Define your stylesheets (you can ad as many as you want here just increment the array index) $styleSheets[0]["title"]='default'; $styleSheets[0]["sheet"]='<link href="default.css" rel="stylesheet" type="text/css" />'; $styleSheets[1]["title"]='alternate'; $styleSheets[1]["sheet"]='<link href="alternate.css" rel="alternate stylesheet" type="text/css" />'; // Set the style that the user will see on their first visit to the site $defaultStyleSheet=0; // this looks if the user has selected a stylesheet (in a cookie or in the session) // and if nothing is found return the default style set above if(!isset($_COOKIE["STYLE"])){ if(isset($_SESSION["STYLE"])){ echo $styleSheets[$_SESSION["STYLE"]]["sheet"]; }else{ echo $styleSheets[$defaultStyleSheet]["sheet"]; } }else{ echo $styleSheets[$_COOKIE["STYLE"]]["sheet"]; } ?> The second part of this is the actual switcher: this should be saved as a include called style_switcher.php <? // Set a cookie for one year on the viewer's machine (can be reduced obviously...) //with the chosen stylesheet info if(isset($_REQUEST["SETSTYLE"])){ if(setcookie("testcookie",true)){ setcookie("STYLE",$_REQUEST["SETSTYLE"],time()+31622400,"/"); }else{ $_SESSION["STYLE"]=$_REQUEST["SETSTYLE"]; } } // Now just send the user back to the page they were header("Location: ".$_SERVER["HTTP_REFERER"]); ?> Now the last bit is in your html, instead of your normal <link> or @import, add this: (this should be added in every page you would like the switcher to operate) <? include('script/style_array.php'); ?> This will write the <link> tag for the stylesheet. Now the last bit you need are the links for user to pick a style, this goes like this: <a href="http://yoursite.com/style_switcher.php?SETSTYLE=0">default</a>version<br /> <a href="http://yoursite.com/style_switcher.php?SETSTYLE=1">alternate</a> version Et Voila! So in brief, you should have 2 includes style_array.php and style_switcher.php and then it's just a matter of adding the bit in your (x)html. I hope this is clear enough, if not, give me a shout and i'll help you Olivier