Jefim Borissov Житие мое

29Oct/0914

Basic CSS layout

The basic CSS layout I use in my work is plain simple - header, sontent, sidebar and footer.

The HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
  <title>My page</title>
  <base href="http://localhost/" />
  <link rel="stylesheet" href="css/style.css" />
</head>
<body>
  <div id="wrap">
    <div id="header">
      Header
    </div>
    <div id="content">
      Content
    </div>
    <div id="sidebar">
      Sidebar
    </div>
    <div class="clr"></div>
    <div id="footer">
      Footer
    </div>
  </div>
</body>
</html>

And the CSS is very simple:

#wrap    { width: 960px; margin: 0 auto; }
#header  { }
#content { width: 700px; float: left; }
#sidebar { width: 260px; float: right; }
#footer  { }
.clr     { clear:both; height:0px; overflow:hidden; }

This is it. This code will show a simple page which is ready for hardcore modification. I know this is pretty basic yet it is one of the most used code snippets in my IDE. Good luck!

Tagged as: , 14 Comments
15Oct/090

Komodo Edit tools – add style.css and reset.css

Good morning, planet. Today I am going to share a very useful script I am using in Komodo Edit (it automates adding style.css). It is very (!) simple yet very effective for me and, probably for others who are doing a lot of HTML files and face a problem of repetitive actions.
This thing works as follows (the use case):

  1. You create a new HTML file in komodo and save it in some directory.
  2. You double-click the script in the Komodo Edit toolbox.
  3. The script adds the following folders/files to the project (paths relative to the file currently in editor!)
    • css/
    • css/style.css
    • css/reset.css
  4. Also the file adds the following HTML code at the cursor in current opened file:


Voila. The needed action is done.

12Oct/096

How-To: Create a horizontal menu

This is a tutorial on how to create a fully costomizable horizontal menu. Why another menu how-to? Well, mostly because there are situations when there are no suitable google results (based on my experience) and you have to come up with something yourself.

These are the features we will try to get into our menu:

  1. It will be horizontal
  2. It will have splitters (made with images)
  3. It will have active class for rollover / selected item (background change)
  4. Menu items will be of different size

This code works for Internet Explorer 6+, Firefox 2.0+, Opera 9+, Safari (at least on Safari 4 - tested on Windows version of it).

Here is a mockup that we have:

Menu mockup

Menu mockup

NB! If you just want to see how to do it - go here for the demo / full code.

8Jan/0818

WebDeveloper add-on for Firefox 3.* (all betas and stuff)

Update: Web Developer addon now officially supports Firefox 3. Check out history (version 1.1.5). Download the new version here.

Old post about my hack:

Just a note that there are a number of features that do not work correctly in Firefox 3. I am working on fixing these and putting together a new release. You are free to use this hacked version of course, but just a word of warning.

Chris Pederick - Author of Web Developer


Today I tried out the brand new Firefox 3 Beta 2. Nice. I like the new address bar and the ability to resume downloads after closing Firefox. The only thing I needed was WebDeveloper add-on (extension), which, unfortunately, does not work in FF3 yet. So, since I had a bit of add-on development experience I decided to change the max version inside the add-on. No problems occurred. Grab the .xpi (change file extension from "jpg" to "xpi" and open it with FF): web_developer-114-fxfl.jpg

That is all :)

18May/072

Zend Studio 5.5 – Antialiasing the font (tested on Ubuntu 7.04

Hi! Today I am very happy to announce that I am now running Ubuntu 7.04!

Now, no long preludes, since this post is about "How the <fluffy bunny> do I get those antialiased fonts to word in Zend Studio?!". That was the question for me about 5 minutes ago. Well, I really thought that Zend was perfect - usually, if they have this checkbox - it works without tweaking. Now here's the disappointment part - that Tools -> Preferences -> Desktop -> Use Antialised Fonts didn't really work. I asked my best friend (his name's Google) -oh, whyyyy?... Google was silent... he didn't know. Fortunately, Google remembered that Zend has a forum! Yay! Searched the forum and found the answer.

Here goes:

"... in <installdir>/bin, edit ZDE.lax adding the following line at the end

lax.nl.java.option.additional=-Dswing.aatext=true

restart ZDE and you should have antialiased fonts... " (c) pkoebbe

That worked like magic. No problems at all! So, I hope that this helps someone and that my friend Google will soon cache this post.

PS The original post on Zend forums is here.

16Oct/060

A great HTML comparison tool for Linux!

Ok, I'm writing this post in english to make it international.

What it this post about?.. It's about a HTML/XML file comparison tool called rfcdiff. Why is it so great? Well there are several reasons:

1) It is free.

2) It generates very nice output.

3) It is easy to install and to use.

4) It is a Linux tool.

It took me about 5 minutes to install rfcdiff. The instructions:

1) Download rfcdiff script from it's site (it's a script, just right-click on the Current version link and save it anywhere you want.
2) sudo apt-get install diff wdiff (these are the requred packages)

3) chmod+x rfcdiff

4) Run rfcdiff by typing "./rfcdiff file1 file2" in terminal and open the output file with your favourite browser! That's all!

I'm sure - you won't be disappointed in this handy tool!

15Mar/060

DMN + Intranet

На данный момент классовая библиотека для проекта DMN (мой с братом CMS), включающий в себя Intranet, составляет ~3600 строк кода. Это при том учитывая, что Intranet сделан ещё процентов на 10%.

Это самый большой проект, который я когда-либо писал.

13Mar/060

Новостной скрипт для сайта группы Inferno

На днях сделал простенький скрипт для добавления/удаления новостей на сайте группы Инферно. В будущем запланированы сдедующие изменения:

  1. Добавление возможности редактирования новостей.
  2. Создание скрипта для управления галлереей.
  3. Редактирование концертных дат, их добавление и удаление

А вообще, скорее всего все эти вещи появятся с результате переустановки сайта на мой CMS.

Filed under: Music, Web dev No Comments