|
|
Posted by Steve Pugh on 04/20/07 19:59
Jon Slaughter wrote:
> "Steve Pugh" <steve.grumpy@gmail.com> wrote in message
> news:1177073062.499049.161470@n76g2000hsh.googlegroups.com...
> > On Apr 20, 4:18 am, "Jon Slaughter" <Jon_Slaugh...@Hotmail.com> wrote:
> >> In the following code I use selectors to position containers and I'm
> >> wondering because of the "depth" of the selection if its better to inline
> >> or not?
> >
> > To use style="" attributes? Maybe. Or just to apply a class to each
> > span.
>
> Yes, I might have to do that but its kinda messy. Actually that is what I
> usually do. I start inlining first and then move the stuff to a class. I
> forgot about that when I posted though and now that I think about it, it
> probably is the best solution.
Inline styles are useful for quick prototyping, you can keep the same
file in front of you in the editor at all times; but should rarely be
included in the final code.
> >> I'll be generating the code automatically for several containers so I'm
> >> not worried about inlining except that it will be much easier to change the
> >> styles of the boxes automatically without having to regenerate the code.
> >
> > How many of these boxes will there be on each page? On the whole site?
> > The savings in bandwidth may add up considerably if there are a lot.
>
> There could be many. With classes I suppose its also much faster because
> there is no "searching" of the DOM. Ofcourse I'm not sure how slow it would
> be in the first place. The classes add a bit to the file size because you
> have to use class="..." for each span but probably not much.
Keep the classnames short, and if you're really worrried, use <b>
instead of <span>. The semantics are marginal, you save six characters
each time and as there's no text content you don't even need to
override the default styling.
> >> Just curious as if theres any good reason not to use the selectors as I
> >> have done it(or maybe there is another way to step through child elements)?
> >
> > The code will be problematic in reality. IE6 and lower doesn't
> > support :first-child or > or +, so your styles really won't work for a
> > large portion of the WWW.
>
> yeah but screw IE6 and below. Doesn't work probably anyways.
Well, if it's just decoration (and that's all CSS should be) then
that's okay. Those of us who do this for a living often need to
consider the large (but not as large as it was, boy has it dropped
fast since 7 came out) percentage of the audience who use IE6 and
expect a site to look reasonably good.
> > Apart from the colour of the top right corner this is identical, uses
> > a lot less code and works better in less sophisticated browsers.
[snip]
> >
> > Of course, as the parent box is fixed size it will still break badly
> > when the user chooses a font size larger than you anticipated. Avoid
> > absolute positioning where possible. It's a powerful tool but not
> > really suitable for most tasks, rather like a chainsaw. And avoid
> > fixed size containers 'cos they're just nasty.
>
> Nope, you don't get it(I think). Here I'm not going to end up using solid
> colors but images so I can't use what you are using. (this is why I have to
> go through the trouble with my original code)
If the box is fixed size, then you can just use one background image.
If it has one fixed dimension and one fluid dimension then you need
two background images. If it's fluid in both dimensions then you need
four background images. One to four nested divs, vs one div plus nine
spans. I know which I'd use. And regardless of the specifics, my
general advice about chainsaws is still valid.
Steve
Navigation:
[Reply to this message]
|