BrijiRaj.com

One day, in the Jungle of Nool, Horton the Elephant (Carrey) is addressed by what he thinks is a speck of dust. Thanks to his extraordinary hearing, Horton learns the speck is really a tiny planet that is home to the Whos, a species seeking protection from certain danger. Believing that “a person’s a person, no matter how small,” Horton takes it upon himself to defend the Whos, even as he faces ridicule from the other animals in the jungle.Smarter to tap to Jim Carrey for another go-round with Dr. Suess than, say, risk another Mike Meyers debacle. Horton is a gamble for 20th Century Fox; Carrey isn’t the hottest property around town (even his g.f. is getting more headlines lately), and Carrell is busy with his hit show and promoting Get Smart. But if Alvin can do it, surely Dr. Suess can, right? It’s not like there’s been another family movie sandwiched between them. Smarter to tap to Jim Carrey for another go-round with Dr. Suess than, say, risk another Mike Meyers debacle. Horton is a gamble for 20th Century Fox; Carrey isn’t the

hottest property around town (even his g.f. is getting more headlines lately), and Carrell is busy with his hit show and promoting Get Smart. But if Alvin can do it, surely Dr. Suess can, right? It’s not like there’s been another family movie sandwiched between them.Director: Jimmy Hayward Steve Martino Stars: Jim Carrey, Steve Carell (Full Cast) Studio: Twentieth Century-Fox Film Corporation

written by admin \\ tags: animated film, Horton Hears a Who!, Jim Carrey, Steve Carell

Stage 1 - Making snow balls

Stage 2- Keeping it on top. Heavier than expected

Stage 3 - Head in the right spot

Stage 4 - WOW! what a nose?

Stage 5 - Beautifing the man

With the creators

The final look. A portrait snap

written by admin \\ tags: Briji, Briji Raj, Brijiraj, Hima, Hima Raj, Masterpiece, Snow, Snow Man

Just came across an annoying issue in IE with my web page design. It killed my 10 minutes and killed all the spirit I had. The issue was displaying the “<form>” tag in IE but as expected it was perfectly fine in Firefox. So I had to give a hack in CSS, by adding following code:

.form {
margin: 0;
}

I hope someone will be helpful with this piece of info.

written by admin \\ tags: CSS, Firefox, hack, HTML, IE, tag, White Space after tag

After registering to Flickr.com for a long time, I haven’t uploaded any of my photographs. Now I started slowly uploading one by one from by best ones. If you like to view those you can visit my link or add me to your account (Jinnibaba).

written by admin

I am sure atleast once in your career you have thought about how to create a ‘Round Corner Stretchable Box’ with minimum graphics. I have tried a lot and visited a lot of blogs and tried out lot of methods. I found the following one to be neat and simple. It hardly takes two minutes. Try it out.

First create four corner images and name them as lb (Left Bottom), rb (Right Bottom), tr (Top Right) and tl (Top Left).

Bottom Left      Bottom Right      Top Right      Top Left

Once the images are ready, we can start the coding. Open you favorite HTML editor installed in your machine or open a Notepad application. We start with a CSS file. Following the same naming convention we used for images, the classes in CSS are also named similarly.

.bl {background: url(bl.gif) 0 100% no-repeat; width: 20em}

The “bl” class contains a background image, position of the image, no-repeat and the width of the box. Dont forget to link the CSS file you have created to the HTML page that you are creating, and place the following code in the right place:

<div class=”bl”>Lorem ipsum dolor sit amet consectetur adipisicing elit</div>

Here class”bl” is for Bottom Left corner and the HTML rule allow us to apply only one background image per tag. Now our box looks like this:

As second step we place the Bottom Right corner of the box. CSS code looks like this:

.br {background: url(br.gif) 100% 100% no-repeat}

This CSS rule is essentially the same as the last one, although now we’ve changed the position from the left to 100%, where previously it was 0%. Now to HTML, please look at this how we can tackle the situation.

<div class=”bl”><div class=”br”>
Lorem ipsum dolor sit amet consectetur adipisicing elit
</div></div>

Take a look at the box after the completion of step two.

Step three and four together. We are left with the top images and I hope you got a hang of what to be done. Yes we can go with the Top Right and then Top Left images. In the CSS code we declare:

.tl {background: url(tl.gif) 0 0 no-repeat}
.tr {background: url(tr.gif) 100% 0 no-repeat}

For HTML, yes like what we follow in step two, assign the top corner classes for the <divs>:

<div class=”bl”><div class=”br”><div class=”tl”><div class=”tr”>
Lorem ipsum dolor sit amet consectetur adipisicing elit
</div></div></div></div>

I am sure you wanna see how our box is shaping up. Take a look at it:

Now you know what more needs to be done. The final step, giving background-color to the box. The background colour must always be assigned to the very first CSS rule. This is because each CSS background rule is essentially a layer on top of the previous one. So, in this example, we have a layering order of br.gif, bl.gif, tl.gif and then tr.gif. But, in this example, the images don’t overlap, so we don’t really notice this layering effect.

By default, a background colour covers the entire <div> and will layer on top of any other previously assigned background images and/or colors. Therefore, if we place the Blue color in any <div> other than the first, it will be placed on top of the preceding images and will essentially cause them to disappear. Therefore, we must place our background-color: #0064E6 in the very first CSS rule:

.bl {background: url(bl.gif) 0 100% no-repeat #e68200; width: 20em}

Now we are done with the box. What left is the beautification steps. We can give padding for the box which is needed to prevent the text from overlapping on to the images. But to which <div> should we assign the padding CSS rule? Does it matter? Well, yes it does very much.

Whichever element we assign padding to, each of the elements inside it will inherit that padding. If we were to assign padding to the very first <div>, <div class=”bl”>, we’d get this effect. See how the box comes:

To get this padding to work properly, we need to assign it to the very last <div>, <div class=”bl”>:

.tr {background: url(tr.gif) 100% 0 no-repeat; padding:10px}

Good work dude! Now you get what you want. Take a look at your creation.

Just before we say “Kudos” for the great work we done, one small tweak for the Internet Explorer. IE always creates headache and that is the reason why I shifted to FireFox. If we do the whole process the other way around, I mean the top first and the bottom later, we will have issues like the background-color sneaking out in some portions. Try it your self. The hacks for IE is:

.clear {font-size: 1px; height: 1px}

<div class=”clear”> </div>

Our final HTML and CSS code looks like this:

<div class=”bl”><div class=”br”><div class=”tl”><div class=”tr”>
Lorem ipsum dolor sit amet consectetur adipisicing elit
</div></div></div></div>
<div class=”clear”> </div>

Here is the CSS that does everything for us:

.bl {background: url(bl.gif) 0 100% no-repeat #e68200; width: 20em}
.br {background: url(br.gif) 100% 100% no-repeat}
.tl {background: url(tl.gif) 0 0 no-repeat}
.tr {background: url(tr.gif) 100% 0 no-repeat; padding:10px}
.clear {font-size: 1px; height: 1px}

written by admin \\ tags: box using css, Briji Raj, Brijiraj, CSS, CSS 2.0, CSS tutorial, HTML, round box, Rounded Corner Stretchable Box in CSS