Screem HTML/XML editor has tag-specific auto-complete, and is a nice editor for web-developers (at least as long as Quanta is not available for Debian testing).

However, version 0.16.1 is very unstable, and dies with

***MEMORY-ERROR***: screem[5527]: GSlice: assertion failed: sinfo->n_allocated > 0

As a workaround (initially suggested for the highly similar Firestarter crashes), try running screem with this command:

G_SLICE=always-malloc screem

Too bad last development version of Screem is dated March 2006.

Simplest way to develop your custom Drupal theme is to start with some skeleton/wireframe theme.

In this post, I’m briefly reviewing 4 themes (atck, blueprint, framework, and zen), made specifically to serve as theme developer’s starting point. All 4 are listed with their features (as per Drupal project page of each one), with my personal “impressions” (not based on actual use experience, yet). There’s also my choice and order of preference for the 4 candidates at the end.
Read the rest of this entry »

When either consulting on a new website design, or actually designing one, keep in mind Ad Unit Guidelines if the website is going to use advertising. The list is far not exhaustive, but sufficiently standard.

Yes, it should.
Read the rest of this entry »

After IE7 came out, it got much harder for HTML/CSS coders to maintain compatibility with both IE6 and IE7.
IE7 is pushing IE6 out, as it is a high-priority update; however, massive part of users will remain on IE6 for various reasons, not excluding the licensing issues (non-licensed/fake-licensed Windows XP will not let install IE7).

The problem is: after installing IE7, you no longer have IE6 (which is replaced by IE7).

However, there is a good and simple solution, enabling one to run IE3 through IE7 on one computer.
To do so, just install the latest version of IE you want (I assume it’s IE7), and then point your browser to evolt’s archive of browsers (what an excellent collection!). You will have to “install” (just copy, really) each older IE you want into a separate directory, and create a short-cut for each. (You may want to use all-in-one installer, found here – also a great package, though I didn’t use it.)

After I installed IE6, I also copied some additional files to its folder (like wininet.dll, version 6.00.2900.2180 or like that), to avoid problems with cookies disabled in IE6.

However, there is a huge problem with multiple IEs: Print Preview and Print do not work at all!
After some searching, I found two bug reports:

• clicking on any bookmark will not load the bookmark, but will open the Print dialogue
• trying to use the bookmark-derived Print dialogue appears not to work: produces blank page

Read the rest of this entry »

I was looking to solve this extremely common problem – when you need to vertical-align:top/middle/bottom something within the DIV element. So far not a single solution fits my exact case, but I collected different solutions here for convenient reference.

• vertical-align CSS property should be applied to the inline element within your DIV (which is a block element), and NOT to the DIV itself. For this to work, you may need to set line-height and font-size to the height of the enveloping DIV element:
  1. <div>
  2. <img src="/images/demoBoxH.gif" alt="" />
  3. </div>
  1. div{
  2.     height:200px;
  3.     width:200px;
  4.     background:blue;
  5.     text-align:center;
  6.     line-height:200px;
  7.     font-size:200px;
  8. }
  9. *>div{
  10.     font-size:12px
  11. }
  12. img{
  13.     vertical-align:middle
  14. }
• there is a different approach: for the element within your DIV, set display:absolute and bottom:0px (or top:0px) to vertically align to bottom or top, respectively. Note that this approach doesn’t let aligning to “middle”, and that it works best when only one block-level element is aligned – otherwise elements will overlap at the bottom/top of container DIV. Container DIV should be set to position:relative.
• another approach: we can set the container DIV to
  1. div {display:table-cell;vertical-align:middle}

  because for table cells vertical-align property works as one might expect from common sense and the text-align property. Basically, by doing so we ask the browser to treat our DIV as a table-cell, where vertical-align works just perfectly. However, this approach appears not to work on most IE browsers (probably except for IE7 only, but I didn’t try, as I need IE6 support as well).

• one more table-cell-display-based solution by Nikola:
  1. .nav_next a {
  2. display: table-cell;
  3. width: 85px;
  4. text-align: center;
  5. padding-top: 60px;
  6. position: relative;
  7. top: 60px;
  8. margin-top: -60px;
  9. }

  This time, display:table-cell is applied to the immediate text container (anchor in the example), and then padding-top is added to push text to the bottom. Should work in FF3 and IE6; in FF3, this solution worked in a test setup without the last 3 CSS attributes, but YMMV.

• vertical alignment can be simulated with margins, applied to the element(s) within the container DIV. This is a simple approach and I would recommend it, if the heights of the container and elements within it are known (otherwise, this method is of no help). Example application of this method: if you have a DIV container 200px high, and need to position some SPANed text within it; first, set SPAN to
  1. span {display:block; height:20px}

  (or whatever height value fits your requirements), and then set margins to vertically align the SPAN. To align your SPAN to top, you would apply

  1. span {display:block; height:20px;margin-bottom:180px}

  to your SPAN; to align to bottom –

  1. span {display:block; height:20px;margin-top:180px}

  to align in the middle –

  1. span {display:block; height:20px;margin:90px 0px}

References:

• reference 1
• reference 2
• reference 3
• reference 4
• reference 5
• another methods collection

(The problem I have involves vertically aligning two DIVs within a container DIV so that DIV1 is aligned to top, and DIV2 is aligned to bottom, and their content is aligned appropriately to top/bottom, and that it works in at least IE6, IE7, FF2. If anyone has a ready solution – please comment. When I find mine, I’ll add it to the list above.)

In Internet Explorer for Windows (tested with version 6 SP2), if you write CSS code similar to this:

and put your “floatbox” inside a container (such as DIV), you will actually see 200px of the left margin instead of the expected 100px. This problem is known as “IE margin-doubling bug”.

In this post I collected solutions you can use to avoid this problem. The solution I’d recommend is at the end.
Read the rest of this entry »