On 06/08/07, Jukka K. Korpela <[EMAIL PROTECTED]> wrote:
>
> >
> http://www.dairyfarmers.com.au/df/ournews/latestnews/2007/07/25/from-rock---n-roll-to-rolling-hills/in
>
> The correct URL appears to be
>
> http://www.dairyfarmers.com.au/df/ournews/latestnews/2007/07/25/from-rock---n-roll-to-rolling-hills
> (i.e., without the trailing characters "/in").


That's very true. I'm not entirely certain where that extra bit came from.
:(

> a) are the first two lines indented slightly (a couple of pixels-worth)
> more
> > than the rest of the article, and
>
> On IE 7, such a problem cannot be seen, except when I tell the browser to
> ignore font sizes specified on web page and I set font size to "Larger" or
> "Largest".
>
> I guess this, and what might appear on IE 6, is caused by the width of the
> "paragraph" containing the date (25.07.2007). It's probably a floated
> element - the markup and the CSS code are too complicated for me to
> analyze now - and this would explain why it pushes the first few text
> lines to the right a bit more than you expected.


Interesting. I've had a look, and the date part doesn't seem to be taking up
any more space than it needs to (it doesn't actually have an explicit width
allocated). I played around with it a bit, changing the width and adding or
subtracting margins and paddings, and I couldn't seem to make that extra
indent change, much less go away.

You can't really know the width needed for a string, in an environment
> where fonts may vary. If you wish to rely on having your primary font
> suggestion obeyed by browsers, you can probably estimate the width needed
> for a numeric date strings in em units - if the font has "tabular" digits
> (i.e., digits with the same width), as most popular fonts have. You need
> to be careful, though, and it's best to make the estimate a bit too large,
> for safety. What's most important is that you use the same estimate when
> setting the width of (e.g.) a floated element and when setting some margin
> that is supposed to align content in a tabular manner.
>
> (Actually, using a table would save quite some estimation work and
> headache. On the other hand, it does not look very natural to put the date
> on the left of text when there is just a single date and not different
> dates relating to different parts of the text - and a simpler idea, like
> putting the date on a line of its own, would lead to easier styling
> challenges.)


It certainly would remove a lot of headaches if I could move the date.
Sadly, that's out of my control. The designers created the design, the
client approved it, I just put bits of it together. *sigh*

So here's the code that sets up those two "columns" for the date and the
text:

#date {
    float: left;
    margin-left: 20px;
    font-weight: bold;
    color: #009de9;
}

#article {
    margin: 0 0 20px 110px;
}
    #article p {
        margin-left: 0;
        padding-left: 0;
    }

IE6 gets a modification to #date in its own stylesheet to give it only 10px
of left margin, because it's like that.

So what would you suggest to do to this to make it a bit more bulletproof
(aside from sticking it into a table)?

Cheers,

Seona.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to