|
|
Posted by Nik Coughlin on 01/04/08 02:45
"GTalbot" <newsgroup@gtalbot.org> wrote in message
news:bfaccb5a-fc10-41ae-ae86-d2cf3bbc7a45@m34g2000hsf.googlegroups.com...
On 3 jan, 18:43, "Nik Coughlin" <nrkn....@gmail.com> wrote:
>> "Fister" <n...@tak.dk> wrote in message
>>
>> news:5575aa932873f8ca1c5e2ee16fe4@news.tele.dk...
>>
>> > I'd like for the div.something-else below the three columns to be
>> > placed
>> > 25 pixels below the coloumn with the longest text. Unfortunately with
>> > the
>> > code below it only relates to the center-column. That causes problems
>> > if
>> > the text in left- or right-column are long. How can I fix this?
>>
>> http://www.nrkn.com/3ColEqualPositioned/
>>
>> Tested in Safari, Opera, Firefox, IE 6 & 7.
>
> Before people start copying that CSS template, I'd like to point out a
> few problems or issues with the webpage:
Thank you for taking the time to look at it :)
> 1- It uses a lot of positioning (relative and absolute) and also
> floats. As a rule, I try to avoid positioning (rel. and abs.) when
> using float. I either use only float (with clear) or only positioning
> but not both.
What led you to formulate that rule? I'm interested to hear, if you have a
good reason I may have to rethink my way of doing certain things.
> 2- Try highlighting/selecting some text in the yellow (left) column,
> preferably toward the top in Internet Explorer 7: impossible.
Hmmm, you're right, but really this is a problem with IE 7, not the layout.
I believe it would be solvable with some trivial hackery inside the lte IE 7
conditional comment, and I will probably do so later.
> 3- I wonder why the template uses so many empty divs:
> <div class="leftBack"></div>
> <div class="rightBack"></div>
> <div class="middleBack"></div>
> <div class="clear"></div>
Aside from the clearing div, one empty div for each column. The empty divs
sit behind the actual columns, taking their height from the parent div (ie
the height of the highest child element) via absolute positioning within a
relatively positioned parent, thereby allowing proper use of background,
border etc. on the columns. I don't think a little extra markup to achieve
an otherwise difficult effect is such a crime, but again, maybe I would
change my mind if I were aware of your reasoning :)
> Clearing with structural markup is not recommendable, certainly not
> semantic markup.
What would you recommend instead? I was of the opinion that a div is fairly
semantically neutral.
Navigation:
[Reply to this message]
|