HighDots Forums  

Re: dt dd inline but dt clear left?

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Re: dt dd inline but dt clear left? in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
dorayme
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-12-2009 , 08:21 PM






In article <4994b8df$0$7945$9a622dc7 (AT) news (DOT) kpnplanet.nl>,
amygdala <example (AT) example (DOT) com> wrote:

Quote:
Hi there,

Consider the following:

div class="column-b-row-c"
h1>what's new?</h1
dl
dt>februari 2009:</dt
dd
h2>Some title</h2
p
Lorum ipsum.
/p
/dd
dt>januari 2009:</dt
dd
h2>Some title</h2
p
Lorum ipsum.
/p
/dd
/dl
/div

With these styles:

.column-b-row-c dl dt,
.column-b-row-c dl dd,
.column-b-row-c dl dd h2,
.column-b-row-c dl dd p {
display: inline;
}


Now everything in the <dl> is displayed inline. How would I make it, so
that a new <dt> element starts on a new line? Sort of "clear: left" if
you get what I mean. "clear: left" obviously doesn't work since the
elements don't float, correct?

Do you have any other suggestions?

You could simply put in a <br> before the <dt>s you want to start on a
new line.

Or something like this.

<http://dorayme.netweaver.com.au/alt/dt_Inline.html>

Or something even simpler and gaining from the built in formatting
magic: table!

--
dorayme


Reply With Quote
  #2  
Old   
Bergamot
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 02:22 PM







amygdala wrote:
Quote:
Consider the following:

div class="column-b-row-c"
h1>what's new?</h1
dl
dt>februari 2009:</dt
dd
h2>Some title</h2
p
Lorum ipsum.
/p
/dd
That text does not look like it belongs in a definition list. You're
just getting yourself hung up trying to force the content into
inappropriate elements. Use better markup.

<h1>what's new?</h1>
<div class="newsitem">
....

Quote:
Please have a look at:
http://amygdala.110mb.com/index-intended.html
FYI, it doesn't look too good at my usual window size:
http://www.bergamotus.ws/screenshots/amygdala.png

Notice the scrollbars. I see those rounded boxes are fixed size
graphics, too. It doesn't do so well with my larger-than-average text
size.

--
Berg


Reply With Quote
  #3  
Old   
rf
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 05:53 PM



amygdala wrote:
Quote:
Bergamot schreef:

FYI, it doesn't look too good at my usual window size:
http://www.bergamotus.ws/screenshots/amygdala.png

Notice the scrollbars. I see those rounded boxes are fixed size
graphics, too. It doesn't do so well with my larger-than-average text
size.


Well, you've got a pretty odd window size. What (platform/screen) are
you using?

Also, you really have me wondering how the hell you managed to get the
text to resize, since it's basically fixed size fonts. Sure, I didn't
get to all the css yet, but it should cascade as fixed size fonts. So,
either you fiddled with it, or you have some odd browser I am not
aware off, that can zoom fixed size css text.
Never heard of Firefox? Seamonkey? Opera? Chrome? Sarari?

Never heard of the accabillity options in IE to ignore author specified font
sizes?

Quote:
And yes, those boxes are gonna stay fixed size. And no, I am NOT going
to make it a fluid webpage layout. I am very well capable of making it
fluid, but we deliberately chose not to.
Never heard of accessibility either I'll bet. What if a visually impared
person stumbles upon your page? They will increase their font size so they
can read it. When it breaks they will probably laugh as they move onto the
next site they have found in google.




Reply With Quote
  #4  
Old   
Bergamot
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 07:13 PM




amygdala wrote:
Quote:
Bergamot schreef:
amygdala wrote:
Please have a look at:
http://amygdala.110mb.com/index-intended.html
FYI, it doesn't look too good at my usual window size:
http://www.bergamotus.ws/screenshots/amygdala.png

Notice the scrollbars. I see those rounded boxes are fixed size
graphics, too. It doesn't do so well with my larger-than-average text
size.

Well, you've got a pretty odd window size. What (platform/screen) are
you using?
Platform/screen is irrelevant. My browser window takes up half my
screen. I like to multi-task. The point is you have designed it so it's
dependent on particular system settings. It will fail if the user
doesn't happen to fit within your narrow view of what the web is.

Quote:
Also, you really have me wondering how the hell you managed to get the
text to resize, since it's basically fixed size fonts.
Hint: as much as you would like otherwise, you cannot control the
visitor's text size. I snub my nose at all those who think they can tell
me what type size I can use.

IOW, I can't read your puny font sizes, so override them. Go look up
"minimum font size".

Quote:
either you fiddled with it, or you have some odd browser I am not aware
off, that can zoom fixed size css text.
Only IE refuses to zoom fixed font sizes, unless the user has it set to
ignore author specified fonts. Other browsers are more reasonable about
that.

Quote:
And yes, those boxes are gonna stay fixed size. And no, I am NOT going
to make it a fluid webpage layout.
Then you don't understand web media at all, are are doomed to fail.

Quote:
I am very well capable of making it
fluid,
Really? I see no evidence of that.

Quote:
but we deliberately chose not to.
Then good luck. You'll need it.

--
Berg


Reply With Quote
  #5  
Old   
rf
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 08:24 PM



amygdala wrote:
Quote:
rf schreef:

Never heard of accessibility either I'll bet.

Yes I have. I've been developing websites for over about 10 years now.
Hmmm.

Quote:
What if a visually impared
person stumbles upon your page? They will increase their font size
so they can read it.

I know.

When it breaks they will probably laugh as they move onto the
next site they have found in google.

Hope they have a good laugh then ;-P

Seriously. They are valid points. But points we knowingly ignore for
this website.
Have you counted the people who do simpy move on to the next site? It's easy
enough to do if you delve into your logs.

Quote:
I'll be honest, accessibility has never been a huge concern for me
when developing websites. Perhaps I'll get around to it some day, but
untill now, I usually had other priorities.
In Australia it is in certain cases *illegal* to not have an accessible web
site.




Reply With Quote
  #6  
Old   
rf
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 09:15 PM



amygdala wrote:

Quote:
But in the end, the graphic designer
(usually my clients) are the ones that have the final say.
A pity. IMHO a graphc designer[1] is the last person you should let anywhere
near web design. It's a different medium.

[1] Graphic designers, I assume, are in charge of designing those labels
that go on shampoo bottles.

A few of them are enlightened and print *SHAMPOO* in big friendly letters.
Many of them don't of them don't and use a flyspeck typeface that is
difficult for me to read *with* my classes.

Standing in the shower without my glasses, which bottle do you think I would
use and be sure I am not putting toilet cleaner in my hair?




Reply With Quote
  #7  
Old   
Bergamot
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 09:52 PM




amygdala wrote:
Quote:
Bergamot schreef:
amygdala wrote:
Bergamot schreef:
Only IE refuses to zoom fixed font sizes, unless the user has it set to
ignore author specified fonts. Other browsers are more reasonable about
that.

Name one or two please. As far as I know, Opera and FireFox allow you to
zoom the whole page, but not the fixed size text itself.
You are wrong. *All* mozilla variations - Firefox, Seamonkey, Epiphany,
and others - have always had the ability to zoom just text. Go look at
the zoom options in the menu, honey. Then go try any version of a KHTML
browser, like Safari or Konqueror.

You claim you've been doing web work for 10 years, yet you don't know
how browsers work? It's no wonder there are so many broken web sites out
there.

Quote:
And yes, those boxes are gonna stay fixed size. And no, I am NOT going
to make it a fluid webpage layout.
Then you don't understand web media at all, are are doomed to fail.

Wow, nice reasoning there. Look up black and white reasoning (for instance).
OK, I'll put it in simple terms: the web is not paper. Paper is a fixed
medium. The web is inherently a flexible medium. Some techniques used in
print design simply don't work with web media.

Quote:
I am very well capable of making it fluid,
Really? I see no evidence of that.

Yes, nice reasoning there again. Just because I haven't given you an
example, doesn't mean I can't do it.
Your attitude doesn't give me any confidence that you have a clue.

Quote:
And to tell you the truth, I really dislike 'fluid design'.
That's funny, I really dislike rigid fixed designs like the one you've
got going here. Mostly because they are horribly broken, like yours is.

Quote:
There's a reason why newspapers, magazines, billboards, literature
I'll remind you that the web is not paper.

Quote:
(or
any other print medium) usually have a certain maximum amount of words
per line (i.e. by means of certain column widths, etc.): readabilty.
It's a simple thing to set a max-width. I do it all the time. Why don't
you give it a try?

Quote:
But if you have a look at said websites (or websites by webmasters so
hung up on fluid design), you usually see a horrible implementation;
Just because some people go overboard doesn't mean that's the way it has
to be done. Use your brain. I find there is a serious lack of common
sense in web design.

Quote:
Not saying webdesign is not a whole other discipline, but some print
design decisions are made for a reason. (And no, I am not a designer. I
am a programmer.) I don't have to resize my book, newspaper, etc. either
to have a decent read do I?
One more time: the web is not paper.

Quote:
I was probably jumping to conclusions here, in that, this wasn't
actually what you were trying to get to,
What I was trying to get to was that half the bloody content was off
screen and inaccessible! There is no good reason to have such a fragile
design, unless you are the only one using the site.

--
Berg


Reply With Quote
  #8  
Old   
rf
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-15-2009 , 10:20 PM



amygdala wrote:
Quote:
rf schreef:
amygdala wrote:

But in the end, the graphic designer
(usually my clients) are the ones that have the final say.

A pity. IMHO a graphc designer[1] is the last person you should let
anywhere near web design. It's a different medium.

[1] Graphic designers, I assume, are in charge of designing those
labels that go on shampoo bottles.

A few of them are enlightened and print *SHAMPOO* in big friendly
letters. Many of them don't of them don't and use a flyspeck
typeface that is difficult for me to read *with* my classes.

Standing in the shower without my glasses, which bottle do you think
I would use and be sure I am not putting toilet cleaner in my hair?

LOL, I see your point, but just out of curiousity: what the hell is
the toilet cleaner doing near the shampoo?! ;-)
You don't have a wife? The shower gets cleaned with the same paint stripper
bleach as goes down the dunny.




Reply With Quote
  #9  
Old   
dorayme
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-16-2009 , 03:38 AM



In article <49978fb0$0$7933$9a622dc7 (AT) news (DOT) kpnplanet.nl>,
amygdala <example (AT) example (DOT) com> wrote:

Quote:
dorayme schreef:
In article <4994b8df$0$7945$9a622dc7 (AT) news (DOT) kpnplanet.nl>,
amygdala <example (AT) example (DOT) com> wrote:

....
Or something like this.

http://dorayme.netweaver.com.au/alt/dt_Inline.html

Or something even simpler and gaining from the built in formatting
magic: table!


Hi dorayme,

....
Your hosted example looks very promising. But somehow I can't get it to
work properly in my site though. Also, it seems that your example looks
like it won't take very long text for the <p></p> elements, which should
be possible. (And should wrap in the grey container)

Please have a look at:
http://amygdala.110mb.com/index-intended.html

This is how it is supposed to look like eventually. But as you can see
I've used <br>'s in this example, which I'm not too fond of as you might
imagine.

This is how it looks with your suggestion implemented:
http://amygdala.110mb.com/index.html

But as you can see, it won't display the elements inline.

Yes, a bit of adaptation would be needed!

Quote:
Tables would be a last resort, as I believe the semantics don't fit the
purpose too well.

I quite disagree with this I am afraid. Tables would be completely
appropriate. There is so much misunderstanding about this! Perhaps it
would help if I gave you some criteria for when to use tables.

1. Ask if it makes sense to have table headings? This is not the
question, Must I have table headings or Should I have table headings but
rather the simple counterfactual, If I had headings would they make
sense considering what is in the column below? The answer is quite
plainly affirmative in your case: "Date" would be first col heading
under the Caption or h-heading "What's new?" You would not actually put
in such a heading because it is too much stating the obvious, but that
it makes *sense* is an indication that tables are appropriate.

Next question: Do the items in the row relate to each other. In your
case does "SOME TITLE: Lorum ipsum..." relate to "Februari 2009". Sure
does in a completely obvious way!

Tables is the very thing for you, amygdala! Don't be frightened of them.
In fact, I was there when they were invented and bequeathed to humanity.
I did not understand the creator's words at the time but I do recall the
cryptic:

"and one day amygdala will go forth and after he has fought to near
death with the bergamot, who called him "honey" and was rebuffed, he
will enter the garden of tables. He will see them and he will see that
they are good and *for* him and he will use them and be thankful".

Quote:
Finally, the news item's are going to be animated with javascript like a
vertical carousel. I believe tables (or table rows rather) won't lend
them selfs too well for this (cross-browser that is), but perhaps I'm wrong.

You will have to ask others about this issue.

(btw I was delighted to see your lovely shapes in the URLs above, a
pleasure to see. It is very hard to use such shapes and have them grow
with text size.)

--
dorayme


Reply With Quote
  #10  
Old   
Chris F.A. Johnson
 
Posts: n/a

Default Re: dt dd inline but dt clear left? - 02-16-2009 , 04:14 AM



On 2009-02-16, dorayme wrote:
Quote:
In article <49978fb0$0$7933$9a622dc7 (AT) news (DOT) kpnplanet.nl>,
amygdala <example (AT) example (DOT) com> wrote:

dorayme schreef:
amygdala <example (AT) example (DOT) com> wrote:
...
Or something like this.

http://dorayme.netweaver.com.au/alt/dt_Inline.html
....
(btw I was delighted to see your lovely shapes in the URLs above, a
pleasure to see. It is very hard to use such shapes and have them grow
with text size.)
You must be using page zoom; they don't grow with text zoom. At my
default viewing size, the text is not contained within the shape:
<http://cfaj.freeshell.org/testing/amygdala.jpg>.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.