How-To: Make sure that custom bullets are aligned with the list text
Instead of setting the list-style-image to your custom bullet, use this way instead:
ul li
{
list-style: none;
background: url(IMAGE_URL) no-repeat center left;
padding-left: VALUE;
}
Works like a charm!
CSS Design Patterns Chapter 3 – 5
I covered almost three chapters today. Topics discussed were selectors and the CSS box model. As I don’t use a lot of the fancy selectors because it’s not supported by IE6, I skimmed over it. The box model material is pretty useful though; I really just have a general idea of how it works so it’s good to read about it in a more detailed manner. Now I won’t be caught unaware when I try a combination of attributes to style a box. Conversely, if I wished to style a box in a certain way, I now have the knowledge of how to do it.
- Block items follow a vertical flow.
- Inline items follow a horizontal flow and wrap to a new line when it doesn’t fit completely.
- You can’t set the width, height, and overflow of inline elements. It depends on the font.
- Tables are special because their width refers to the outside of the border, unlike everything else which specifies the inner box.
- Tables don’t have padding, but cells do. Cells don’t have margins, but tables do.
- Absolute items don’t affect the flow but are rendered in a different layer.
- Floated items affect the flow of other boxes.
- The float attribute specifies the horizontal position, but the vertical position is determined by its current inline position.
- Certain items can be sized (set size), shrinkwrapped (fit to content), or stretched (fit to parent)
- You cannot horizontally shrinkwrap a block box, it will always be stretched by default (or sized if set)
The box model, I believe, is something that every aspiring CSS guru needs to master.
What I’ve Learned So Far
With Apress’s Pro CSS and HTML Design Patterns:
- A design pattern consists of four elements: pattern name, problem, solution, and tradeoffs.
- Cascade order is determined by selector priority, then number of selectors ordered by priority, then location groups, then location level, and finally listing order.
- To simplify the cascade, minimise the number of stylesheets linked or imported, and sort the selectors by importance.
- Use baseline stylesheets to reset styles created by the browser.
- A good HTML structure is important as it provides the basis for the CSS selectors. HTML or XHTML can be validated to ensure that the document is valid.
- The safest MIME type to use for XHTML is
text/html. <!DOCTYPE>must be the first element in a document; otherwise Internet Explorer 6 will render in Quirks mode, which does not follow CSS standards.- Use conditional stylesheets instead of hacks to target Internet Explorer 6/7.
- Block elements should not be siblings with inline elements. Do not put content in between blocks; rather, content must be inside a terminal block at all times.
Decided to forgo CSS: The Definitive Guide as I found it to be a beginner’s book. The other book I’m reading in conjunction with Design Patterns is CSS Mastery: Advanced Web Standards Solutions.
I will be writing my notes in this blog so that I can keep track whether I’m learning anything!!
CSS
Work has been consistently pushing me towards front-end development. I like to think of myself as a back-end developer – give me classes, methods, and translating business rules to working logic anytime.
So being forced to do HTML, CSS, and slicing seems kind of, for a lack of a better word, insulting.
But hey, it doesn’t hurt to learn more about the ins and outs of styling – it could be pretty useful in the future. (And it will save me from internal groaning whenever I receive a task that involves slicing.)
Actually, I do have a bit of intermediate CSS knowledge, more than the average developer. I sort of straddle the divide between front-end and back-end already. But to be honest, I still don’t have the confidence to say that I am a truly a master of the front-end, because most of my CSS skills come from trial and error. I’d like to get to the point where I see a design, and immediately think of the best, correct way to build the template, without having to go back-and-forth with solutions, and tearing my hair off once cross-browser issues crop up.
Oh, and it still takes me longer to slice anything, than my workmate (who works mainly on front-end.) So once I get up to her speed, I’ll be happy. :)
Having said all that, I’m starting out by (virtually) picking up a (virtual) copy of CSS: The Definitive Guide by Eric Meyer. With hope, I’ll transform my incomplete CSS knowledge to a more concrete skill.
Safari Books Online
I got myself a 10-day free trial of Safari Bookshelf because of two things:
- I wanted to read “Fundamentals of Game Design” by Ernest Adams
- I didn’t have $100+ to fork out to buy the book
If I continue with my subscription it’s AUD 25 a month. I still wonder if it’s worth it though. I’ve long been complaining about computer books – they get so outdated quickly, and they are basically paperweights after their use-by date. With Safari Books Online I wouldn’t have this problem. My only concerns are:
- I love books – I like the feel of reading a book
- Reading online has its distractions… Not sure if I can absorb the material as easily as reading from a physical book.
Still, SBO’s advantages weigh out the disadvantages… we’ll hear the final word before Valentines’ Day (the end of my free trial.)
Flash development
I’ve been really bored the past few weeks so I’ve been thinking of stuff to do.
There’s still chores to be done but really, chores were made for procrastination!
I wanted to read new computer books but the delivery will not be for another 3-5 weeks. In the meantime I took out one of my old computer books: “Beginning Flash Game Development for Dummies”. Have had this book for ages but never really bothered to do the actual work. So I decided to make it my project for the upcoming weeks.
However, after some research I realised that the ActionScript used in the book is pretty much outdated. It’s still using Flash MX 2004.
My question now is – should I bother learning AS 2.0 or just move on to 3.0?
I guess 2.0 is good to learn but I won’t really be a full-time Flash developer so I don’t have any use for it. Learning 3.0 makes my book pretty useless though :(
Or I could just continue doing the work in the book and move to 3.0 when I’ve finished it.
What do you think?
The C Programming Language, Lovecraft Version
For some strange reason – as soon as I read the first paragraph, I could not stop!
C functions may be used recursively; that is, a function may call itself either directly or indirectly. Uninquiring souls may take this as just another peculiarity of those C folk, of whose ways their neighbours speak little to outsiders but much among themselves.
Keener news-followers, however, wondered at the events of the winter of 1927-28, the abnormally large number of calls placed upon the stack, the swiftness with which that list was sorted, the disturbing lack of heap allocation throughout the proceedings, and the secrecy surrounding the affair.
People in the nearby towns had talked about C for nearly a century, and nothing new could be wilder or more hideous than what they had whispered and hinted years before. Many things had taught them secrecy, and there was now no need to exert pressure on them.
But at last I am going to defy the ban on speech about this thing. It was I who fled frantically out of C Recursion in the early morning hours of July 16, 1927, and whose frightened appeals for action brought on the whole reported episode.
Read the rest here!
Hello again, World!
I’m not a very good writer. Which is probably why I’ve started, stopped, and restarted so many blogs. I think it stems from me not being a very coherent thinker. Every second, every day I keep getting new ideas – and getting bored with old ones.
That wasn’t really a good introduction, was it? What I just want to say is this:
My name is Kristina and I’m a serial blog restarter.
The crime I present to you today is this very blog you’re reading. Yes, I’ve restarted my WordPress blog, for the purposes of creating an online presence again, but this time geared to my tech side.
Being a developer is something I’m passionate about. Well, probably not as passionate as some guys out there (those who live and breathe coding – you know who I’m talking about.) But I’m trying to get there. For as long as I remember, I’ve been interested in computers. I think I picked up a DOS Manual when I was 10 or so. My favourite subjects in high school were Social Studies – and Computers. I had to fight with my parents so that they’d let me take up Computer Science in university, instead of becoming a doctor. And today, I work as a .NET web developer.
I still consider myself a newbie when it comes to the field. So many awesome people have been working in this industry, with years and years of experience. Some don’t have that much experience, but possess uncanny intellect – and also the zeal to spend their free time constructing code. Some have also been gifted with the power to communicate, and they reach out to other developers. Using their blogs, they share their knowledge to thousands of people, and also create discussion amongst the community.
I don’t know if I can be any of those people. But what I know is, I love IT, and I’m glad I chose this path.
But to be honest, I’m not really sure if I will succeed in maintaining this blog. Maybe I should add posting here as one of my New Year’s resolution.
