Welcome to my blog

Ever seen this strange CSS bug in Opera? · CSS · / 5 06 2005 - 00:22

I was working on a site when i encountered a strange phenomena.

Some paragraphs appeared blue underlined when loading the page and when i scrolled the page up and down, the underlining disappeared!

It was the first time i ever encountered this strange effect in Opera. Now i’m used to strange things in IE (as most of you lol) but in Opera…

I couldn’t make any sense of it: what triggered the effect, how to solve it?

So i did a bit of asking around and some kind soul on the CSS discuss list pointed me to the Opera forum where this bug was discussed in 2002! As it seems, text-align: justify triggers it.

Solution: real simple in fact. Just add this piece:
” * { text-align: left !important } ” without the “” and it’s solved.

In my case however i still keep being puzzled because i didn’t use text-align: justify but what the heck… problem solved. Maybe i’ll find out if something else triggers it also but for now i’m a happy camper !

Finally!! · CSS · / 26 05 2005 - 23:41

Finally, after a long time of every day work shit, i managed to make a new template, called Metallica.

It’s up for grabbs.

Easy CSS !!! · CSS · / 5 05 2005 - 01:59

Like most of you i have been reading the imperative books on CSS, the blogs, joined lists… but i still had to find a source where you can find CSS explained in plain english. You know: not with all that technical mumbo jumbo but straight to the point, accurate, easy to read and understand.

Low and behold: i did find it.

Tommy Olsson has a blog called Autistic Cuckoo. Autistic Cuckoo? Yeah, i can here you laugh already but let me assure you, Tommy is far from Cuckoo.

He knows what he’s talking about and does it in a real simple manner. His article on positioning and floats is a jewel!

You can find his great stuff in the section called “Web” on his blog.

Converting from pixels to em or % · CSS · / 14 04 2005 - 14:04

We all know that using pixels for a font-size isn’t the most preferable way.

But what if you have to do a redesign where the original Css is made up of pixels for font-size. Experimenting, guessing?

Sure, you can do that. But there’s a better way:

To go from pixels to em’s, simply divide the pixels by 16.
So, 8px will give you 0.5em.

Another way is to have this conversion table by hand.

Looking for some rounded corners? · CSS · / 29 03 2005 - 17:34

We probably have read all those tuts, instructions … on how to make those popular rounded corners with CSS.

Well, if you’re tired of doing it yourself, you might want to hop over to the CSS Rounded Box Generator.

It does the work for you, but like with all those automatic tools: use at your own risk.

And yeah, it doesn’t work on IE 5.5 PC (what a shock huh?)

Comments [2]

Templates back up for grabs · CSS · Design / 7 03 2005 - 00:02

I discovered my templates section screwed up once again. It seemed it was impossible to download the templates due to a glitch in the system.

I managed to get it back in order (for the time being) so you can grab my templates again.

I’m sorry if you had to go to the trouble to try and take them but they’re up for grabs now :-)

Ah, something spanking new!!! · CSS · Design / 29 11 2004 - 21:42

Yesterday i installed a neat php script which produces a spanking new guestbook. The script was delevoped by my awesome friend and partner in design fiddling Dude.

We managed to get it implemented on my site and i must confess: it’s a beauty!!

Here are some features it has:

1. Server side form validation.
2. PHP live request for previewing comments formatted with Textile.
3. Gravatar.
4. Alternating comment classes (idea inspired by yours truly).
5. Automatic smileys.
6. E-mail notification.
7. Clean valid XHTML.

The whole thing is php created, so the only structural stuff you have is the one needed for your page.

I still need to tweak the CSS a bit but that’s just some minor stuff.

I say: thumbs up Dude!!!!!

Comments [2]

Containing block revisited? · CSS · / 17 11 2004 - 02:04

While still strugling with the script for that search implementation i was drifting off into CSS space and thought it might be a good idea to try to explain what the containing block means in CSS. Yup that’s right: i dediced to boldly go where many others have gone before ;-)

K, here we go.
As you probaby know CSS uses several positioning schemes and one of them is “aboslute positioning” (also known as AP)
In technical mumbo jumbo, absolute positioning allows an element to be positioned with respect to that element’s containing block.
This said, the words “containing block” are crucial.

If you want to position an element absolute, that element can be positioned with 4 properties: left, top, bottom, right .

How does the containing block work?

You positioning an element, like a <p> or <div>, and then any element enclosed in that element takes its co-ordinates relative to that element.

Let’s make things a bit more clear with a few examples:

Example 1

<div style="position:relative;">
  <p style="position:absolute;top:5px;left:5px">bla  bla</p>
</div>

The <div> sets the co-ordinates with a position:relative. The <p> is contained by the <div> because it’s inside the opening and closing tags. The <p>’s position:absolute takes its co-ordinates from the <div>. No matter where the <div> will end up, the <p> is 5 pixels from top and left-hand edge of that <div>. The <div> acts as the containing block for the <p>.

Example 2

<div style="position:absolute;right:0;">
  <p style="position:absolute;top:5px;left:5px">bla bla</p>
</div>

Here the <div> has position:absolute and starts at the top-left corner of the viewport, but right:0; positions its right-hand edge on the right-hand side of the viewport. The <p> takes its co-ordinates from the <div> so it ends up 5px from the top/left corner of the <div>. Again, the <div> acts as the containing block for the <p>.

And that’s a brief summary on the containing block. If you want to know more, you might catch up on my Positioning Tutorial.

Some help needed · CSS · Design / 15 11 2004 - 00:12

I’m implementing a search engine that gives you the possibility to search my site. So far it functions perfectly but before adding it on my pages, i was checking to see if it validates because it uses a mix of php and xhtml in the php script.

And yes, it didn’t validate so i had to clean it up. 95% of the errors are fixed but i’m still left with a few stuborn things.

If somebody could assist me, i would be most gratefull :-)

Comments [2]

Red alert - solved · CSS · / 30 10 2004 - 01:09

Phew, finally: i fixed the problem.

Templates are back up for grabs :-)

Comments [5]

Prev Page |

Quick links

Links to other parts of the site.

• Contact
• Tools
• Linkage
• Technical

Friends

People who have been good enough to me that I would call them friends.

• Adrian
• DarkBlue
• Erik Sagen
• Gordon
• Phil

Syndicate this blog

• RSS
• Atom

Reading:

• Gordonmaq
• Meyerweb
• AndyBudd
• SimpleBits
• Left Justified
• Mezzoblue
• Stuff and Nonsense
• Urbanmainframe
• Branchleft
• Kartooner
• Boogenstein
• Cssbeauty
• Megalithic
• Kpont
• Researchkitchen
• OrderedList

Listening to:

Kid Frost: La Raza

Categories

• CSS
• Design
• Pc talk
• Small talk

Find it

archives:

Other:

Unless otherwise expressly stated, all original material of whatever nature created by Dzinelabs and included in this site and any related pages, including the weblog's archives, is licensed under The Creative Commons License.

Powered by TextPattern.