 |
| |
| Author |
Thread |
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-11-2003 21:10
Hi, guys. How are you? I am a wee bit suspiscious what I did. I want to make three paragraphs parallel. I used to use table to do so. But now I think I have to move on new way to do so using CSS. Here is my code:
quote:
<html>
<head>
<style type="text/css">
h1
{
position: absolute;
top: 100px;
left: 300px
}
h1.tom
{
position: absolute;
top: 200px;
left: 50px
}
h1.ken
{
position: absolute;
top: 3%;
left: 70%
}
p
{
position: absolute;
top: 40%;
left: 40%;
right: 40%
}
p.tim
{
position: absolute;
top: 60%;
left: 5%;
right: 65%
}
p.kim
{
position: absolute;
top: 20%;
left: 70%;
right: 5%
}
</style>
</head>
<body>
<h1>A heading</h1>
<h1 class="tom">Hiroki Kozai</h1>
<p>
The <b>heading</b> is placed 100px
down from the top of the document,
and 100px to the right from the
left side of the document.
The <b>paragraph</b> is placed 200px
down from the top of the document,
and 100px to the right from the
left side of the document.
</p>
<p class="tim">
Hello, this is hiroki. How are you todya? I am well thank you.Hello, this is hiroki. How are
you todya? I am well thank you. Hello, this is hiroki. How are you todya? I am well thank
you. Hello, this is hiroki. How are you todya? I am well thank you. Hello, this is hiroki.
How are you todya? I am well thank you. Hello, this is hiroki. How are you todya? I am well
thank you. Hello, this is hiroki. How are you todya? I am well thank you. Hello, this is
hiroki. How are you todya? I am well thank you. Hello, this is hiroki. How are you todya? I am well thank you. Hello, this is hiroki. How are you todya? I am well thank you. Hello,
this is hiroki. How are you todya? I am well thank you. Hello, this is hiroki. How are you
todya? I am well thank you. Hello, this is hiroki. How are you todya? I am well thank you.
Hello, this is hiroki. How are you todya? I am well thank you. Hello, this is hiroki. How
are you todya? I am well thank you. </p>
<h1 class="ken">Aran and Colin</h1>
<p class="kim">
This is Hiroki! I am dying to beat Aran and colin. They are so good that I cannot win yet.
But tomorrow! I will win. This is Hiroki! I am dying to beat Aran and colin. They are so
good that I cannot win yet. But tomorrow! I will win. This is Hiroki! I am dying to beat
Aran and colin. They are so good that I cannot win yet. But tomorrow! I will win. This is
Hiroki! I am dying to beat Aran and colin. They are so good that I cannot win yet. But
tomorrow! I will win. </p>
</body>
</html>
Any advices are the most welcome. Thanks.
Hiroki Kozai
|
Dracusis
Maniac (V) Inmate
From: Brisbane, Australia
Insane since: Apr 2001
|
posted 03-11-2003 21:46
Ok, firstly, you should be including a <doctype>... Browse through www.webstandards.org for some tips on which one you shoud be using.
Secondly, your using a mixture of fixed and relative positioning which makes the page to some really funky things when you re-size the page. Are you checking this in different screen resolutions?
Anyways, if your after the three column effect then I suggest you check out www.glish.com/css or www.bluerobot.com/web/layouts/ for a template to start with. Study how they aproach various different methods for setting up CSS layouts and use them to build one that best suits your needs.
[This message has been edited by Dracusis (edited 03-11-2003).]
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-11-2003 22:21
Dracusis: be careful about using the phrases "fixed positioning" and "relative positioning" when you're really referring to absolute positioning measured in pixels and percents.
Hiroki:
1. Dracusis is right in that using percents for the heading tags, but pixels for the paragraph tags, will misalign the document when the user resizes their browser.
2. Your document order doesn't make any sense. You must remember to consider what the document will look like *without* CSS applied. You have two headers, followed by two paragraphs, then one header, then a paragraph. Structure the document in the way that makes sense when it's layed out linearly! I suggest the following structure:
1. heading #1
2. paragraph that goes with heading #1
3. heading #2
4. paragraph that goes with heading #2
5. heading #3
6. paragraph that goes with heading #3
Because that makes sense *without* the CSS. Now, if I misunderstand your document's structure, maybe you did mean to lay it out like that. However, having two <h1> tags in a row makes no sense. You might mean to use an <h1> followed by an <h2>. (This would be equivalent to a main heading followed by a sub heading.)
Now, in order to simplify the positioning, I would actually recommend *this* structure:
<div id="part1">
<h1>...</h1>
<p>...</p>
</div>
<div id="part2">
<h1>...</h1>
<p>...</p>
</div>
<div id="part3">
<h1>...</h1>
<p>...</p>
</div>
Then you can use CSS to position the #part1, #part2, and #part3 divs respectively, and allow their contents to flow naturally within them.
|
Nethermind
Bipolar (III) Inmate
From: under the Milky Way tonight
Insane since: Feb 2003
|
posted 03-11-2003 22:32
Dracusis!
This is exactly what I was looking for (bluerobot.com) to help me learn how to use css instead of HTML for alignment that used to work with tables.
Thanks!
~N
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 00:17
Hi, Slime! Wonderful to hear from you. Thank you very much for your advices. It is really fun to controll layout using CSS even I am not good at it yet. I am off to lunch now so that I will try your code later on. Actually I couldn't find <div> in w3schools.com tutorial. I am sorry if I was blind. But I have been looking for how to use <div> for ages.
I am very happy now. See you later, Slime.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 02:22
Hi, Slime. I am back to the library to try what you said. I have coded the way you told. But it seems to be wrong because doesn't work at all. Please help me.
Here is my code.
[quote]
<html>
<head>
<title>CSS practice</title>
<style type="text/css">
div.part1
{
position: absolute;
top: 3%;
left: 20%
}
div.part2
{
position: absolute;
top: 20%;
left: 40%
}
div.part3
{
position: absolute;
top: 40%;
left: 70%
}
</style>
</head>
<body>
<div id="part1">
<h1>Tom is hero!</h1>
<p>
Tom went ot Afganistane to save people.
</p>
</div>
<div id="part2">
<h2>Hiro is hero!</h2>
<p>Hiro saved a wee girl in the fire. He did well.
Hiro saved a wee girl in the fire. He did well.
</p>
<div id="part3">
<h3>Aran and Colin</h3>
<p>
Aran and Colin are unbeaten. But pretty soon will be by Aleki and I.
</p>
</body>
</html>
I expected three colums were set parallel. But nothing happned yet. Wow, wow, wow. Why?
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 02:35
Wow, guys. It worked. I put <div class> instead of <div id>.
But pardon me. What is the difference between id and class?????
Dracusis, I saw the site you told me. It is good site, a?
But I found <div class> and <div id> at the same time on here: http://bluerobot.com/web/layouts/layout3.html
I guess there will be big difference I don't know. Do you have any idea, guys?
Plus this question, please.
The third paragraph doesn't listen to my CSS at all. It alwasy stick to the middle paragraph. The rest of all working well. Do you know why?
Here is my code.
quote:
<html>
<head>
<title>CSS practice</title>
<style type="text/css">
div.part1
{
position: absolute;
top: 3%;
left: 10%;
right: 70%
}
div.part2
{
position: absolute;
top: 20%;
left: 40%;
right: 30%
}
div.part3
{
position: absolute;
top: 40%;
left: 80%;
right: 10%
}
</style>
</head>
<body>
<div class="part1">
<h1>Tom is hero!</h1>
<p>
Tom went ot Afganistane to save people.
</p>
</div>
<div class="part2">
<h2>Hiro is hero!</h2>
<p>Hiro saved a wee girl in the fire. He did well.
Hiro saved a wee girl in the fire. He did well.
</p>
<div class="part3">
<h3>Aran and Colin</h3>
<p>
Aran and Colin are unbeaten. But pretty soon will be by Aleki and I.
</p>
</body>
</html>
There will be a lot more questions. Pretty interesting to me.
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-12-2003).]
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-12-2003 04:08
This is a good time to point out that the W3C specs are something that *really* need to be read.
you *NEED* to use class='" in your divs, because in your style sheet you specify them as a class by using the '.'
A class and an id are defined rather logically -
a class can be applied to any number of elements of any type throughout the page/site.
An ID can only be specified once by one element.
So, a class is a general style that you will use for more than one type of element, or on the same element more than once.
An ID identifies one specific thing, and only once.
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-12-2003 04:23
Hiroki: the problem with that last example you posted is that you forgot to close the second and third <div> tags. Close them and things should work better. (You're missing two "</div>"s.) DIV tags, unlike P tags, must always be closed.
For the differences between class, and ID, i'm going to refer you to the FAQ, since we've had some pretty thorough discussions on it in the past and they cover more of the details than I will in a single post:
http://faq.ozoneasylum.com/FaqWiki/shownode.php?id=1045&sortby=rating (be sure to check out the "relevant threads" links.)
That will also show you how to apply style information to an element with a particular ID (in short, you use # instead of . )
[This message has been edited by Slime (edited 03-12-2003).]
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 07:52
Hi, DL! Hi, Slime! It is working propery what I expect.
Now I am going to read that thread Slime told me.
Thanks for your help.
I really adore you, guys.
Cya.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 08:50
Hi, guys. I have jsut read that thread. I quite don't understand <div id>.
Excuse me, DL. You said:
quote:
An ID can only be specified once by one element.
An ID identifies one specific thing, and only once.
Would you give me an example of <div id>. I cannot figure out the situation to use it.
Also that thread Slime told me:
quote:
html =
<div id='nav' class = 'auxillary'>;aldfjdsljfsd</div>
<div id='links' class = 'auxillary'>;aldfjdsljfsd</div>
<div id='sidenote' class = 'auxillary'>;aldfjdsljfsd</div>
<div id='whatever' class = 'auxillary'>;aldfjdsljfsd</div>
What the hell is going on here? I thougth I was able to use <b>id</b> only once for each elemement. Wow, wow, wow~. Confused......
Hiroki Kozai
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-12-2003 08:56
They didn't mean that you can only use one ID on each page... if you define an ID in your style sheet, it only refers to one element on the page, but you can define many IDs (like "navs," "links," "sidenote," etc.).
And I would stress DL's advice: you really need to read through the CSS specs. They may not be the most exciting reading, but take your time to go through them carefully and it may clear up a lot of things.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 09:33
All right. Thanks very much. I will read it.
Ps. I really concern about North Korea, Suho. Hope the situation around there will be all right.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 09:35
All right. Thanks very much. I will read it.
Ps. I really concern about North Korea, Suho. Hope the situation around there will be all right.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-12-2003 21:07
I feel myself damn......
I surfed through http://www.w3.org/Style/CSS/ .
I found a lot of list of book or web link or something like that.
Actually which part do you recommend me to read.
Wow, wow......
Help.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-13-2003 20:55
Hi, guys. good morning. Just five minutes to Operating System class. I just wanted to say that I have started to study CSS tutorial from gurusnetwork.com by briggle.
I have been stick to CSS, HTML, and XHTML like Slime said me before.
All right. Better go.
Hiroki Kozai
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-14-2003 00:08
"Would you give me an example of <div id>. I cannot figure out the situation to use it."
On my website, I have two main <div>'s. One holds the content, the other holds the menu bar, which I originally called the sidebar. The code for this is:
<div id="sidebar">...menu bar links here...</div>
<div id="content">...content here...</div>
"I thought I was able to use id only once for each element."
That is correct. I'm not sure what the confusion is, but let me point out a few things which may clear it up:
1. In the example you showed, the "id" attribute was only used once for each element. The other attribute in each element was "class", and there is no restriction about using classes and id's on the same element (it's quite common).
2. Perhaps you're confused about the meaning of "element." This is an element: <div>...</div> This is another element: <p>...</p> This is yet another element: <div>...</div> Keep in mind that an element is a *single instance* of an opening tag, a closing tag, and its contents. So you can have hundreds of <div> tags, and they're all separate elements. The concept of the general "div" tag is a *type* of element, but it is not an actual element until it's used on the page. What I'm trying to say here is that you can have multiple elements on a page created with the same type of HTML tag.
As for http://www.w3.org/Style/CSS/ , the specific part that you should read is the "CSS Specifications" section, which is at the bottom of the page. It links to the CSS2 Technical Reports, at http://www.w3.org/TR/REC-CSS2 . That is what you should read. Read the abstract, then scroll down to the Quick Table of Contents, go into the first one, and just begin reading. It's long. If you spend a few hours reading it every night, you'll probably finish within a week or so. Take it slowly, and don't overwhelm yourself by reading too much information at once. You can skip the parts that look unnecessary, like "Acknowledgements" and "Copyright Notice," etc. The appendices are optional. Good luck =)
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-14-2003 05:17
Hi, Slime. Thank you very much. I am very happy to hear from you. Now I have jsut seen the list of all those W3org site. It is daunting, isn't it? Well, long way to go, I guess. Never mind. I will do my best. Have a good weekend. see ya.
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-14-2003 18:30
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-15-2003 09:18
Hi, DL. How are you? Thanks for your advice! Yes, I have already printed out whole those tutorial. I have actually finished up to lesson three of part one. It is really clear so that I can pick up the details easily. I really thank Briggle. I will knock it off first then move to www.w3c.org.
Well, have a good time for rest of your weekend.
Bye.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-16-2003 23:48
Hi, guys. How are you today? Did you have a good weekend? Yes, I did. Hope you did too, people.
Well, I have been stucking to CSS for a while. I got a wee confusion. Please see this.
quote:
body { background: #87cefa color: red}
What??? I got a blue background and black text. I expected red text. I got red text when I delete background: *87cefa. What is that for to put color: red?
Please help me........wow, wow, wow...
Hiroki Kozai
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-16-2003 23:57
You're missing a semi-colon after the background property!
use
body { background: #87cefa; color: red}
instead of
body { background: #87cefa color: red}
As a general practice, I put a semi-colon after *every* property, because then it's harder to forget doing it:
body { background: #87cefa; color: red;}
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-17-2003 00:26
Good morning, Slime. How are you? Thanks for your help. I should have done it more carefully, haven't I?
Well, this time I got more serious problem. Please see following:
My link, Here2 and Here3 gets blue but Here1 and Here4 gets green color. It is Monday mistery to me. Do you have any idea or do you see silly mistake?
quote:
<html>
<head>
<title>Pseudo-Class</title>
<style type="text/css">
a
{
font-family: verdana, arial, sans-serif;
font-size: 10pt;
font-weight: normal;
}
:link
{
color:blue;text-decoration: none;
}
:visited
{
color:green;text-decoration: none;
}
:hover
{
color: red;text-decoration: none;
}
:active
{
color: yellow;text-decoration: none;
}
</style>
</head>
<body>
<p>If you are interested in, please click below.<br />
<a href="test.htm">Here1</a>
<a href="text2.htm">Here2</a>
<a href="text3.htm">Here3</a>
<a href="test.htm">Here4</a>
</p>
</body>
</html>
wow, wow, wow, agian.....
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-17-2003 00:44
you have blue specified for :link. Green specified for :visited.
So, obviously, if something is showing as green, you have visited that link.
I have to add here, that while I admire your tenacity, I think you would benefit from a *lot more* trial and error on your own, and a lot less asking everytime something doesn't work the way you expected...
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-17-2003 05:14
Hi, DL. Thank you for your comment.
Well, I understand what you mean. But I am afraid this is the msot difficult to understand.......
I mean how browser knows if it has been visited or not. I found that there were blue and green link. After that I closed IE then opened my html file again. What I expected was that those link became all blue. But they were still blue and green. Why browser still knows I have visited that link even I closed it.
And refresh button!!! When I found those green and blue link, I pressed refresh button to make them all blue. But as you know, it didn't work at all. But I am afraid I don't understand why it not.
Would you have any idea about them?
I really respect you and people on this site. I'd like to be like you. Again, thank you for your help. It has been my honor to be on this site.
Wow, wow, wow,
Hiroki Kozai
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-17-2003 06:42
The only way to make the browser forget what links you've visited is to clear the browser history.
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-17-2003 08:54
OK, I've also got to ask... what difference does it make if the links show up green or blue? Isn't that why you specified different colors for the default links and the visited links? I'm not sure why you want all the links to be blue, since that will only reflect the current state of your browser's history, and will have no effect on what other people see. I'm a bit confused as to what you're trying to do...
[Edit: Oh, and thanks for asking about my situation. As of now I am still alive, so this is good. Hopefully things will continue in this fashion.]
[This message has been edited by Suho1004 (edited 03-17-2003).]
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-17-2003 10:51
Thanks guys. Hi, Suho. I have been just tring to understand pesudo class. When I coded like above, I expected all the links blue. I made four links. There were two greeen links. I thougt they should have been blue. I tried figured out why I got that green link when I opened html file in my broser.
Well, I have had a can of beer. I am off to bed soon. See you tomorrow. Thanks for your help. Good night.
Hiroki Kozai
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-17-2003 13:57
Ah, OK, I get it now...
quote:
Well, I have had a can of beer. I am off to bed soon. See you tomorrow.
You crack me up. 
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-17-2003 14:21
I assume the file that these links are in is called "test.htm"?
In that case, as soon as you've loaded the page, you have visited those two links.
So, in this *particular* case, even if you clear your browser history, the links wil always show green becuase you're *on* the page that they link to.
So, if you want them to always be blue, specify blue for a:visited.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-17-2003 21:31
Hi, everyone. Good morning. How are you? Winter is coming here. It is being bloody chilly here.
Thanks for your reply and help. This thread is the first one I made, which become fire file. I am so pleased to feel myself knowing more everyday. Really really thank you.
Today I will move on to gurus's tutorial css part2. Last night, I had a quick look having Australian beer. See what I can get. All right. Have a good day. See you on the internet sometimes.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-17-2003 23:44
Hi, guys. I have just been trying to figure out how to make the effect like: http://www.tantek.com/CSS/Examples/boxmodelhack.html . You will see there are 4 colors on your screen, which is white, black, light yellow, and dark yellow, right?
I guess white is background color, black is border color, light yellow is background of What???? Even I have no idea how to get those dark yellow around the text!!! I reckon light yellow is background of paragraph???
If I can get this, it will be huge advantage. Please help me,,,wow,wow,wow.....
ps. I am off to database class now. I am learing data desing also access. It is a bit boring, gosh.
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-17-2003).]
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-17-2003 23:53
Right click -> view source
You can figure that one out yourself =)
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-18-2003 00:17
doesn't he explain it in the code that is on the page.....?
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-18-2003 02:23
Hi, Slime, Hi, DL. Good afternoon, here.
Well, I cannot see css code of it. It is showing only quote:
<style type="text/css" media="all">@import "boxmodelhack.css";</style>
.
Wow, wow, wow........
Anyway, I will figure out myself surfing web, thanks for that.
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-18-2003 02:58
if that's where the style sheet is, that's where yo go - http://www.tantek.com/CSS/Examples/boxmodelhack.css
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-18-2003 03:00
Hi, guys. I guess I hit the right web site to figure it out. I am sure but probably "floting element" will be my answer. Now I am reading it. Then I will report to you later. Cheers. wow, wow, wow.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-18-2003 03:42
Hi, DL. Thanks for that. I got that css! I didn't know I can get it that way. Cool.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-18-2003 09:10
I am going to haave a beer. Then work for css tutorial again, again, again, like drink beer, beer and beer. I love beer. Wow, wow,wow...
Hiroki Kozai
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-18-2003 09:47
Hmm... something tells me that drinking a lot of beer before trying to figure out new stuff might not be the best idea...
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-18-2003 21:43
Good morning, Suho. I agree, Suho. But I really like drinking beer reading article. I try to read what I do next day before going bed. Beer makes me sleep well. Don't you reckon?
Hiroki Kozai
|
kuckus
Bipolar (III) Inmate
From: Berlin (almost)
Insane since: Dec 2001
|
posted 03-18-2003 22:00
Hey Hiroki - if your learning experience was only slightly related to the "wow" factor of this thread that would clearly proove that you're approaching things the right way and drinking is a valid option. Good to see you're having fun
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 01:36
Hi, mate! Nice to hear from Cermany.
Well, I have just finished gurus's tutorial up to lesson5. I am off to lunch now.
In my brain, CSS is hopefully sinking down. Now I am printing w3org css specification. It will be about 85pages. Oh, my goodness. Lots to study, isn't it? But will do. see ya.
Ps. div div div It so cool.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 03:04
Hi, guys. I have just finished tutorial here: www.gurusnetwork.com . I will reveiw them to make sure I can do it without seeing examples. Also I have printed out css specification to read. It has heaps. Probably glance it at tonigth with beer. Good on me!!! So thanks for your help. I have been so happy to share time with you. See you later. Have a good day.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 03:55
Hi, guys. How are you? It has been so hot in this room. It makes me feel thirsty....But not yet, not yet....
Well, do you remember I have been trying to get design effect something like: www.tantek.com/CSS/Examples/boxmodelhack.html I made something simillar to this not color but idea.
Would you please see if I am coding using right way?
My code is following:
quote:
<html>
<head>
<title>three color will be done</title>
<style type="text/css">
.test1
{
background:#00aa22;
width:400px;
height:400px;
border: 20px solid #00ff00;
}
.test2
{
background:#aa9933;
width: 200px;
border: 4px solid #334455;
position: absolute;
top: 23%;
left: 23%;
}
.test3
{
background:#22ddcc;
width: 300px;
border: 4px solid #006677;
position: absolute;
top: 30%;
left: 10%;
}
</style>
</head>
<body>
<div class="test1">
<div class="test2">
<P>Hello, guys.</p>
</div>
<div class="test3">
<P>This is Hiroki Kozai. Is this right way to code? Wow, wow,woooooo. This room is so hot but
nice smell comes from kitchen. Student cooking something. </p>
<p>I have finally figured out how to do it.</p>
</div>
</div>
</body>
</html>
what I did was put div inside of div. I didn't know I could do so.
Any advices, highly happily appreciated.
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-19-2003).]
[This message has been edited by Hiroki (edited 03-19-2003).]
[This message has been edited by Hiroki (edited 03-19-2003).]
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-19-2003 05:47
Yup, you can put divs inside of other divs... that's called nesting
Now, I don't want to confuse you or anything, but you don't need to use divs for every element. For example, you could just as easily make the "Hello, guys" div an <h1> heading, and then apply the styles to that. One step at a time, though. Now that you've got nesting down pat, I'm sure you're pretty excited about the possibilities.
One suggestion, though: try out your code in various browsers and see if it works. Make sure you're in line with the CSS specs. Then, if something doesn't work the way you think it should, you can ask a question about it here. But don't be afraid to play around with the code on your own for a while and see what you can come up with. That's really the best way to learn, I think. If you get stuck you can always ask for help here.
As for beer, it depends on how many I have--one beer (for some reason) usually makes it harder for me to sleep. If I have a few more it gets easier. Once you get up into the double digits, we're not really talking about sleeping anymore, we're talking about passing out. But that hasn't happened to me in quite a while...
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 08:06
Hi, suho. Thanks for your reply. I have been working on CSS for quite a bit. It is really cool, isn't it? I am thinking of making web site, which I can sum up what I studied so far. Probably good idea to make sure I can code CSS well.
Actually I have been building my homepage for a couple of weeks. It has not been finished yet. All elements are held into table. I am going to change it using CSS as well.
Beer....I have just had a can of beer, Suho. I also love drinking beer with cooking dinner. It is one of the best relaxation. Do you agree?
Thanks for your advice. See ya.
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 03-19-2003 09:26
Sounds to me like before you become a master web designer, you're going to die of alcohol poisoning!
By the way, Hiroki, is it correct to assume from your name that you speak Japanese? I have a Japanese vocabulary question that nobody's been able to answer for me.
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-19-2003 10:40
Yup. Beer is good. Just out of curiosity, though, what's your brand?
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 10:56
Hi, Perfect Thunder, Hi, Suho. Wonderful to hear from you.
Yes, I can speak Japanese much better than English. How can I help you, PT?
Just tell me.
And Suho! Here New Zealand, there are so many kinds of beer. To my surprised, each local people seem to drink only thier local beer. Supermarket does't cover other place's beer. In my country I can buy anything at supermaket. Interesting.
My favorite is DB, Speights, Guines and so on. Guines is Irish beer. Other two are New Zeland beer produced by Sounth Island. I don't drink this much before. Now I can drink a lot.
All right. I am off to bed now. Have a good night. See you tomorrow. Wow, wow.
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 03-19-2003 11:13
On maps, there is often a marker showing which way is north. On some maps, this marker is a complex decoration of its own, with many layers of arrows pointing in eight or sixteen directions. They look like this.
In English, we call it a "compass rose," because it sort of looks like a flower.
What's it called in Japanese?
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 21:43
Hi, PT. Good morning. How are you? Well, I never thought of the name of it. But anyway I found out. It is called RASHINZU. It is for voyage, isn't it?
This site is my compass rose to wonder around web world.
Have a good day. See ya.
Ps. Actually this is my first time to answer something on this site. It has nothing to do web but still feel good to help. Any further question, no worries.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 23:17
Hi, guys. Good morning, again. How are you?
Well, I have been building my css review site. Just small question. I made two colums setting parallel. I got white space between them. I wanted to get rid of it. My code is following.
quote:
<style type="text/css">
.css1
{
background: #11dd33;
width: 25%;
height: 100%;
position: absolute;
top: 0%;
left: 0%;
padding-top: 20px;
padding-left: 20px;
border-right: 10px solid black;
}
.css2
{
background: #556677;
width: 60%;
height: 100%;
float:right;
position: absolute;
top: 0%;
left: 24%;
padding: 20px 10px 10px 30px;
}
</style>
I set first colum like you see. The width is 25%. I set second colum top: 0% left:25%. I thought those two colums will be next to each other without any white space. When I found white space, I thought margin is causing that problem. I set it like margin: 0px; but it didn't work. Then I finally got it changed like above. But is that right way? Feel like wrong or there may be better way to set two columns put together.
Thanks in advance. Any advices will be my honor.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-19-2003 23:40
Wow, I figured it out! There was an answer at http://www.glish.com/css/2.asp . float. It is cool. If I want to set colums without any white space, float will get rid of it. If I want to use white space between colums, just set border white and set width, I reckon. Do you agree, guys?
Ps. Beer made me sleep well last night. Did you have some too?
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-20-2003 01:30
Hi, guys. I have got a heavy problem. Please see my css following:
quote:
<style type="text/css">
body
{
background: #009999;
}
.css1
{
background: #00ffcc;
width: 25%;
height: 100%;
float:left;
padding-top: 20px;
padding-left:13px;
border-right: 2px solid #000099;
}
.css2
{
background: #66cccc;
width: 60%;
height: 100%;
float:left;
padding: 20px 10px 10px 30px;
border-right: 2px solid #000099;
}
.css3
{
background: 00ffcc;
float: left;
width: 15%;
height: 100%;
padding: 20px 10px 10px 20px;
}
.css4
{
background:#6666cc;
width: 95%;
padding: 5px 5px 5px 5px;
}
.css1, .css2, .css3, .css4
{
font-family: verdana,arial, sans-serif;
font-color: brown;
font-weitht: normal;
font-size: x-small;
}
</style>
Here is my senario. I set three colums parellel. .css1 is for right colum, .css2 is for middle colum and css3 is for right colum. I wrote heaps words in the middle colum. There are hardly any in right and left colum. Then I found that right and left colum background color didn't catch up with the middle one!!! It looks aweful. I am thinking of the way how to fix. But not yet. Would you please have a crew for me?
Now I am off to lunch now. See you soon.
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 03-20-2003 02:56
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-20-2003 06:11
Hi, Perfect Thunder! Thank you for your help. I tried it but I am afraid it didn't work. Hmmm......I thougth it would work......Hmmm...
My code is following:
quote:
body
{
background: #009999;
height: 100%;
}
.css1
{
background: #00ffcc;
width: 25%;
float:left;
padding-top: 20px;
padding-left:13px;
border-right: 2px solid #000099;
}
.css2
{
background: #66cccc;
width: 60%;
float:left;
padding: 20px 10px 10px 30px;
border-right: 2px solid #000099;
}
.css3
{
background: 00ffcc;
float: left;
width: 15%;
padding: 20px 10px 10px 20px;
}
.css4
{
background:#0066aa;
width: 95%;
padding: 5px 5px 5px 5px;
}
.css1, .css2, .css3, .css4
{
font-family: verdana,arial, sans-serif;
font-color: brown;
font-weitht: normal;
font-size: x-small;
}
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 03-20-2003 07:48
Hmm, I thought it would work too! I'm about to go play chess at the local bar, but when I get back, I'll try playing with your CSS to find a solution.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-20-2003 08:48
Wow, you play chess! I want to learn how to play it. In my country, there are simillar game. Play chess having a beer, right? Good on you. See ya, PT. Have fun.
ps. Tonight I had a glass of wine. My family makes beatiful wine. In vineyard, grapes are just turing themselves ready to be picked up. Great to see them, actually.
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 03-20-2003 12:18
Ah, now I remember how this works. In CSS, a containing object is at least as big as the object inside it. So if you want the left and right column to be as tall as the middle column, find a way to put the middle column DIV inside the other two. It sounds weird, but it should work.
If I remember right, I did something similar for this layout. Look at the HTML and CSS if you'd like, but watch out -- even though I wrote it as simply as I could, it's complicated.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-20-2003 21:53
Hi, PT. Good morning. How was last night? Did you have good time playing chess and having a beer? Well, thanks for your reply. I have jsut saw your site that made me impressed. Now just five minutes to have OS class. So I will read them later. Have a good day. Really wonderful to hear from you. See you later.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-21-2003 01:30
Off to lunch now. Hungry...
Cannot work on CSS druring day because I have 4 classes. Bloody Friday...But still good to know
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-22-2003 01:34
Reading, reading, reading, w3org specification. anyway, have a good weekend.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-22-2003 08:48
Hmm....I have been reading and sleeing continuously. ID. ID. ID. CLASS CLASS CLASS.
Let me ask you something.
I jsut read this: [url]http://faq.ozoneasylum.com/FaqWiki/shownode.php?id=1045&sortby=rating[/rul].
What is the difference between making another special class and using ID? My understanding is that ID is used to difine something special for each element. But I think I can do same thing making another very special class. Am I wrong, or need to make myself more clear?
Any advices, welcome.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-23-2003 05:50
Hi, guys. Would you plesae go to site review. I made my first attempt. Cheers.
Hiroki Kozai
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 03-23-2003 06:40
You're right; there's nothing an ID can do that a separate class can't do (until you start working with scripting). The difference is in the *meaning*.
Consider, are you labelling the element as a specific thing, or as a *class* of things?
Some examples:
specific thing: "my favorite food"
class of things: "good food"
specific thing: "example #3"
class of things: "example"
specific thing: "my web page"
class of things: "web page"
specific thing: "Windows 98"
class of things: "operating system"
If you're labelling an element as a specific thing (for instance, "sidebar", or "content area", or "main heading"), use an ID. If you're labelling it as a single instance of a class of things (for instance, "code example", "invisible", or "thumbnail image"), define a class that you can reuse later on for other instances of the same class.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-23-2003 10:06
Thanks a lot. Your example are really good one, I reckon. And I am pleased to hear what I meant was right.
Slime, thanks for being my company. I love that more than nothing at the moment. Sorry as much as I love beer.
By the way, have you seen this my web site: http://www32.brinkster.com/sanukiudon/html/csstemplate5.htm .
I made this wihtout inline format. Just using CSS. Please have a look and give me your opinion.
Cheers,
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-23-2003).]
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-25-2003 08:45
Hi, guys. I am feeling much better now. It was terrible flu actually. Well, now I am all right.
By the way, I have been studying only CSS for a couple of weeks. CSS seems to be sank into myself quite a bit ( at least more than before). Now I am working on my CSS sumary site like you know above. I just wanted to declare that I will move on to Javascript and XML next. Then I want to study PHP as well.
I really want to be able to creat rich Dymanic web site. Hope you will be with me like you have been. Any advices for that will be great.
All right. See you later.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-26-2003 01:37
Just small but important question.
Pseudo-class...
I think I can do like this:
quote:
a {
font-size: 10pt;
}
:link {
color: blue;
}
:visited {
color: red;
}
I read a lot of tutorial and w3c css1 specification as well. But some people said to me that I cannot omit a in front of peudo classes. What do you think?
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-26-2003 02:44
I'm actually unclear on that issue myself - have seen it done that way, but I always inlcude the a. Anyone have relevant info on that?
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-26-2003 03:30
Hi, DL! Thanks your reply. Anyway, it won't be big problem if I put a[, will it. By the way, I got another question here. I am trying to creat drop cap effect using pseudo-element. My code is below:
quote:
<style type="text/css">
p {font-size: 12pt; line-height: 12pt}
p:first-letter{font-size: 300%; float: left; color: red;}
p:first-line {color: blue;}
span {text-transform: uppercase}
</style>
As you expect (probably), I am not happy about the result. Becasue the first letter gets bigger and interfere with second line!!! How to solve this?
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-26-2003).]
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-26-2003 03:51
{{edit - Ooops...misread that. I am confused over what you want.
The idea behind what you;ve done there is for the letter to do exactly what you've described....
[This message has been edited by DL-44 (edited 03-26-2003).]
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-26-2003 06:33
Hi, DL. Thanks a lot. But I mean it was not what I expected. Becasue the first letter of the first line covered second line of the first letter. I don't want that. Is there way to solve it?
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 03-26-2003 12:41
With regard to the anchor pseudoclass - all I know is that it didn't work for me on Mac IE 5 with the "a"s omitted. So be sure you put them in. Once I did that, the hover worked fine. I then found the gray unreadablem, but the effect worked!
With regard to the drop cap - please don't specify type intended for the web using "point" units - that's for print. Use px if you must, or em if you are adventerous. Using percent the way you did for the first character is fine too. I don't believe I know why the enlarged first letter covers up the line below it. What's up with that "span"? At a quick glance that looks out of place.
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-26-2003 18:15
Hm, hadn't noticed the 'pt' in their - good call Steve.
I also see no need at all for the span deal to be in there - if you want the first letter capitalized, just type it that way in the first place
Not sure why it's not working properly. Try getting rid of the 'pt' measurements and the span though for starters.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-26-2003 21:50
Hi, Steve. Hi, DL. Thanks for your reply. I will try them.
Well, I am finally feel all right. I have been sick since last weekend. Today I will work hard to make my css site.
see ya.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-27-2003 03:17
Hi, guys. I have a question. Hmm...My question is getting difficult, isn't it?
Well, here is quote:
quote:
Pseudo-class can be used in contextual selectors;
a: link img {border: solid blue} from w3c css1 spec
What I am trying to do is to make img link with border, which color will change like dependent on the mouse action: link, visited, hover and active.
What I have got so far is below:
quote:
<html>
<head>
<title>img as link</title>
<style type="text/css">
a:link img {border: solid blue;}
a:visited img {border: solid red;}
a:hover img{border: solid yellow;}
a:active img{border: solid black;}
</style>
</head>
<body>
<p>
You can also use an image as a link:
<a href="pseudoclass.htm">
<img src="../images/button.gif">
</a>
</p>
</body>
</html>
But it seems not working. Especially hover effect doesn't work at all. Do you know any solution or way to do so?
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-28-2003 07:09
This thread has been quite big one, hasn't it?
Well, I have got damn silly queistion. Please see my code:
quote:
<html>
<head>
<style type="text/css">
em {
background: #cc9;
font-family: verdana, sans-serif;
font-size: x-small;
margin: 0;
border: solid black 2px;
}
</style>
</head>
<body>
<p>Hello, this is <em>interesting</em>, isn't it?</p>
</body>
</html>
Why border doesn't come up around my emphasized element???? It has been hell to figure out this easy problem. Help....wow, wow...
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 03-28-2003 12:26
I have no idea why it doesn't work for you. I copied and pasted your code into a new document and t worked fine.
Do you ever run your style code through a validator? I ran your "em" code through this one:
http://jigsaw.w3.org/css-validator/validator-text.html
and all I got was a warning about there being no background specified, which in effect means it should work fine. Validators are good tools. The can be cryptic at times, but they can also save you a lot of work, and help preserve the number of hairs on your head.
The validator doesn't care for your sparse html, so I'd stick to just pasting in the css rules instead of trying to validate the whole html document.
[This message has been edited by Steve (edited 03-28-2003).]
|
Veneficuz
Paranoid (IV) Inmate
From: A graveyard of dreams
Insane since: Mar 2001
|
posted 03-28-2003 12:54
It worked for me as well when I used Opera or Mozilla, but it didn't work in IE. So it might just be little IE bug...
_________________________
"There are 10 kinds of people; those who know binary, those who don't and those who start counting at zero"
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 03-28-2003 12:56
I used IE 5 Mac, and the Safari beta. Worked in both. You probably want to pad it some so the border isn't so tight to the word.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-28-2003 23:19
HI, guys. Thanks for your reply. It was very strange to me too.
Well, now i cut and paste my code then opened it again. It is working now. The difference is that I used IE.? with windows NT and now I am on IE? with windows XP.
Hi, Steve. I used that validator! It is good one, a? Sometimes it is pretty tough to find small typo errors.
Thanks a lot, guys.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-29-2003 01:26
Hmm....Strange enough. I hve made background effect fix and scroll. I mean there are two html file showing each effect. What is happening is when I specify background to be fix background image love moving when I scroll down. And when stays same position when I set it as scroll. ???? Why this is happening???? I have no idea. They are supposed to be vice vasa, aren't they? My code is following:
quote:
<style type="text/css">
body {
background: #0cc;
background-image:url(../images/hiroki2.gif);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}
</style>
quote:
<style type="text/css">
body {
background: #0cc;
background-image:url(../images/hiroki2.gif);
background-repeat: no-repeat;
background-position: center center;
background-attachment: scroll;
}
</style>
Wow, wow,....
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-29-2003 02:13
IE does not support background-position:fixed;
Check the compatibility chart that was posted for one of your earlier questions =)
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-29-2003 02:35
Hi, DL. Thanks your reply.
Well, yes. I did it. But I thought IE suported this effect. Please see this:
http://www.w3schools.com/css/pr_background-attachment.asp
It said:
quote:
This property only works with the body element
Hmm...
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-29-2003 02:59
Ok, sorry - I didn't see read carefully enough. I had my mind fixed on "position:fixed;" rather than background-attachment.
Now, I'm a little confused by your wording -
With "background-attachment:fixed;" the image stays in the same place in relation to the browser window. So if it is set to be centered on the page, it will stay centered in the browser window no-matter how much you scroll.
Is that what is happening or no?
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-29-2003 07:59
Well, I set an image center and center. But I think that it might have do nothing with background attachment effect. Background-position will decide where image sits. Am I right?
But background-attachment will decide if image will stay on same place when user scroll down or not. I mean if set attachment fixed, image will be gone if user sroll far down on the screen. But if set scroll, image has to stay on the screen regardless of user scrolling down.
What is happening is that when I set it fixed, image scroll down. When scroll, it is fixed. It is strange, isn't it?
Hope my poor English make sense to you, DL. Thanks for your reply, again.
I am making curry rice for my family. My curry is loved by them. My pleasure.
See ya.
Hiroki Kozai
|
Suho1004
Maniac (V) Inmate
From: Seoul, Korea
Insane since: Apr 2002
|
posted 03-29-2003 11:00
That sounds to me like the opposite of what should happen. I use fixed on most of the stylesheets for my site (www.liminality.org), and it works fine... perhaps you could post a link to the example?
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-29-2003 17:26
I'm still confused by your wording, and I think you might possibly be confusing the meanings of scroll and fixed.
Fixed does not mean fixed on the page, it means fixed in the containing box (in this case the Browser window).
So if you set it to fixed, and scroll the page, the image will remain visible in same location in the browser.
If you set it to scroll, it will stay in the same position in relation to the text on the page, and will therefore scroll off of the page.
Sorry if I'm misunderstanding and stating the obvious, but it seems to me you have the meanings reversed.
(of course, I never actually use 'scroll' I just don't specify a background-attachment in that case).
[This message has been edited by DL-44 (edited 03-29-2003).]
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-29-2003 23:14
Hi, Suho. Hi, DL. Thanks for your sharing time.
Well, yes. I have a link. please see here:
http://www32.brinkster.com/sanukiudon/html/bg2-fix.htm
In this site, background image is set attachment: fixed
But it is scrolling down, isn't it???
Hmm.....Am I wrong????
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-29-2003 23:18
Nope, that is precisely what "fixed" is supposed to do.
It appears that this has been, in fact, a confusion of terms.
It seems that you're seeing the fact that it moves in relation to the TEXT as it scrolling, when in fact, according to it's position relative to the BROWSER it is fixed.
So it is working properly, there's just some confusion over the terms (and now you see why the browsers all have such a hard time making things work the same ).
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-30-2003 00:51
Oh, thanks, DL. It is my misunderstanding, isn't it? Thanks a lot. Now I am going to have lunch, which is left over from last night. See ya.
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 03-30-2003 01:45
It's "fixed" for me too - meaning the background image remains stationary as the text scrolls.
Hmmm. I think Hiroki is making faster progress with CSS than I did, and it must be due to his focus on CSS, beer and curried rice.
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-30-2003 03:32
I guess the curried rice must be the factor, because I know I had plenty of beer handy when I was frist discovering CSS
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-30-2003 05:22
Hi, Steve, Hi, DL. Thanks for your reply.
Well, now I have just had curry rice again. All left over is gone.
Studying CSS is so fun that I have been really enjoying that.
Thanks for helping me.
See you.
ps. Do you cook curry rice sometimes? I do often. I quite like it.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-30-2003 05:52
Hi, guys. How are you doing???
Well, I have just got to ask you something important. I have been working on CSS ( including HTML, XHTML) for quite a bit.
I'd love to move on to next step. Forgive me my sillyness, What do I have to do next?
I am interested in XML, Javascript and server-side-scripting ( probably take PHP). Could you give me your opinion or whatever comments on it?
Ooops. please delete one of these. Something strange happned.....
Hiroki Kozai
[This message has been edited by Hiroki (edited 03-30-2003).]
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-30-2003 14:08
Well, personally I would recommend doing a lot more experimentation with HTML and CSS...make a variety of sites that require different approaches to layout, make use of as many different styles as you can.
You can make pages that actually have a definate purpose, or simply make mock-pages for imaginary companies or organizations. It can be quite helpful.
However, if you're set on moving on to something else, there are two definate directions to go in - Javascript or PHP (as you've already mentioned).
Which direction you go is an entirely personal and subjective matter. Both directions will eat up a lot of time, and will give you a lot more flexibility and power in creating your pages.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-30-2003 20:36
Hi, DL. Thank you for your reply. How are you today?
Well, I am going to have to finish school at least the end of September. So I always worry about if I can achieve what I want to learn.
And yes. I think so too. I'd better design a lot of site using HTML, XHTML, and CSS. Much better than before but still not good enough.
Long way to go, but I can see what I have to do through your advices, thanks again.
Yes, I will keep making other site like you said. Thank you for your help, DL. I really appreciate that.
By the way, which stage do I need XML???
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 03-31-2003 01:25
Well, my understanding of XML is still rather vague - perhaps Steve can shed a bit more light on it, I know he has at least dealt with it when passing information from a database into a Flash movie.
That is basically the idea behind XML...passing information between different formats that don't normally communicate with each other.
And I'm doing well - hope you are too.
=)
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 03-31-2003 01:54
Hi, DL! Thanks for your words. I have just been back from lunch.
Well, I will ask around about XML. Thanks a lot for your help.
Now I will do my sound recording assinment.
I have no idea what is going on that module. Pretty tough.
See ya.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-01-2003 02:54
Hi, guys. Who will be honored to be 100th poster?
Well, let me talk about block-level-element.
My understanding is that it cannot exist same line, can they?
It means h1~h6 , paragraph, div and so on.
Right?
But why my div element and h1 element are sitting same line when I see it using IE5?
How strange!!!!
Please see my code:
quote:
</head>
<style type="text/css">
.middle{
background: #666;
width: 63%;
position: absolute;
top: 10%;
left: 20%;
border: solid #fff 1px;
padding: 8px;
}
.test{
float: left;
border: solid #fff 1px;
}
</style>
</head>
<body>
<div class="middle">
<div class="test">
<a href="#">Change Mode</a>
</div>
<h1>Head2</h1>
<p>Good afternoon</p>
</div>
</body>
Am I wrong or IE5 bug???
Hiroki Kozai
|
DL-44
Maniac (V) Inmate
From: under the bed
Insane since: Feb 2000
|
posted 04-01-2003 05:09
The "float:left;" allows them to exist on the same line.
Remove that and you will see them split.
The absolute positioning tends to mess with things as well.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-01-2003 07:06
Thanks a lot. DL. I am making another site for my operating system class.
Love to use css. Really cool way to organize.
See ya.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-02-2003 07:18
I just wanted to tell you that I found what I have been looking for.
Well, I have been wondering how to use CSS for table format. I found one here http://www.w3.org/TR/REC-CSS2/tables.html . It is CSS2 specification, which you told me to read. I am slow to read but steadily keep going for ahead.
Thanks for that.
See ya.
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 04-02-2003 11:52
Hiroki;
I'm ducking the xml thing for the moment, because it's more complex than I have time for just now.
But ... you might find these two resources valuable: http://www.meyerweb.com/eric/css/references/css1ref.html http://www.meyerweb.com/eric/css/references/css2ref.html
Eric Meyer has made the CSS 1 and 2 specifications very easy to navigate.
Hope it helps.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-02-2003 22:58
Hi, Steve. How kind of you. Yes, it is very valuable for me. I am going to go to Christchurch, which is the biggest town in South Island in New Zeland. I will find some book for my study. Hope I will find one which I look for.
Again, thanks very much.
Have a good day.
Hiroki Kozai
|
Emperor
Maniac (V) Mad Scientist with Finglongers
From: Cell 53, East Wing
Insane since: Jul 2001
|
posted 04-03-2003 00:54
Hiroki: If you are using (valid) XHTML then in essence you are already using XML and have taken on board some of the underlying principles. I would (like the others recommend) you concentrate on getting more XHTML and CSS (and a bit of JavaScript and server-side coding) under your belt. XML is easy and if you need to use it then you can pick it up quite easily.
Concentrate on the things you need to learn to get the job at hand done - that is the great motivator
If you try and learn things because you think it is a good idea then it is less likely to stick.
And I admire your enthusiasm, energy and commitment to learning
___________________
Emps
FAQs: Emperor
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-03-2003 01:24
Hi, Emperor! Wonderful to hear from you.
Thanks for your kind words.
I am really glad to be on this site as I can see great web works through here.
That shows me a lot of possibility of web world.
I have been looking for what I will do for ages.
I am glad to dovete myself into the web.
So really feel well to go ahead.
Would you know what I mean?
Anyway, I'd like to say thank you to all of you.
See you later.
Ps. Thanks for your comment about xml. Yes, I will study more HTML, XHTML, CSS1, CSS2. Actually I am interested in HTML developer certificate, which W3C provides. Has anynoe got one? Cheers.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-04-2003 04:29
Hi, guys. I got a problem.
Today I opened my html file using Mozilla.
It looked fine using IE but not on Mozialla.
My code is pretty basic using a lot of css.
Why does this happen and how to avoid this kind of problem???
I mean I am following w3c recommendation so that I did not think Mozzila disklike my code.
Help.....
Hiroki Kozai
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 04-05-2003 17:29
Mozilla's CSS support is generally better than IE's CSS support, although it does have a few bugs here and there.
What you need to do is look at every inconsistency, one at a time. Then decide whether the problem is your misunderstanding of how a feature is supposed to work, or if it's IE doing something wrong, or if it's Mozilla doing something wrong. The first case is the easiest to fix; you merely look at the standards, relearn how to do it, and fix it up. In one of the other two cases, you may have to find a workaround.
But one thing is extremely important, and I cannot stress this enough: make *absolutely sure* your page has a proper doctype, or I can guarantee you IE will be treating your CSS incorrectly, and you probably won't be able to find workarounds.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-05-2003 22:29
Hi, Slime. Great to hear from you. Thanks a lot for your words.
Well, I should admit that I don't know about Doctype well. I am trying to close all tag to pretend like xhtml but never put doctype in my docment. I guess missing it caused a problem, doesn' t it?
I will read that link. And will try to put proper doctype. See what will happen.
See ya. Again, thanks a lot.
Hiroki Kozai
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 04-06-2003 03:24
Some browsers work differently with different doctypes, so it's important to use a doctype that's the same as the code you're using. If you're using XHTML, use an XHTML doctype.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-06-2003 04:33
Hi, PT. Thanks a lot.
I will read about it.
Now I am studying about database.
I have a test on Tuesday.
Well, see if I can pass.
See ya.
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 04-06-2003 05:04
Another good resource regarding doctype - goes into even more depth than the alisapart article.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-06-2003 07:07
Hi, Steve. Thanks for your input. Kind of you.
Well, I will certainly read them.
I have been studying databese theory since yesterday.
I am getting fed up with it.
But also know very important to understand, you know.
My host mom is cooking dinner now.
Looking for dinner now.
see ya.
Again, thanks a lot.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-08-2003 06:28
DTD is going to be extremely important to put when I use XML, right?
I have jsut found a book about XML at the library. I took a quick look. I found it said that. I will definitely read the linsks above. See ya.
Ps. it take quite time to donwload this thread, doesn't it?
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-08-2003 12:17
I got stomachache.....Hmm.....Woooooo.......
A glass of wine will save me...
Now I am drinking it....
Hm.......Good night.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-09-2003 08:13
I passed database test. I just got exactly what I have to get. I mena I got 80 % of it which means jsut on the boarder. Lucky enough.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-10-2003 11:24
A wee good news for myself.
I have just decide to extend my study period.
I can study till the end of the year.
So I don't have to rush.
Wow, so I can study steadily to achive what I want to.
Tomorrow is the last day of first term.
I will work on more CSS over the holidays.
Good on me.
Good night.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-14-2003 10:19
Hi, all. How are ya?
Now I have jsut got three weeks autumn holiday.
I have just printed out all CSS2 specification from www.w3c.org.
I jsut thought it was heaps.
How can I approach those CSS2 specification?
Any advice highly appreciated.
Actually long time no see, I reckon.
Hiroki Kozai
|
Steve
Maniac (V) Inmate
From: Boston, MA, USA
Insane since: Apr 2000
|
posted 04-14-2003 15:24
Hiroki: you might want to subscribe to a mail list that is dedicated to css. You can sign up for one I think might be helpful here. This link also links to a sign-up form for a more advanced css mail list, but you might want to start with the foundations one. Reading the entire w3c spec would be awfully difficult, and I don't know how productive it would be. It's meant as a reference, not something the average web designer reads from top to bottom. A mail list can provide a lot of practical information I have found.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-14-2003 22:52
Hi, Steve. How are you? It has been so beautiful autumn days here in New Zealand.
Thanks for your help, Steve. I will have a look that site.
Yesterday, I printed out CSS2 specification but it was absolutely heaps. Anyway good to have those, I reckon.
Thanks a lot.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-16-2003 05:47
Oh, my good!
I cannot do this silly thing.
I am trying to move caption a wee bit higher.
My css code is:
quote:
caption { margin: 5px;}
But it didn't work at all. Why????
Please help me.
Hiroki Kozai
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-16-2003 11:52
Hi, again. I just wonder....
Well, now I am reading CSS2 specification from w3c site.
A lot of CSS2 seems not to be supported by the browser, right?
Now I am looking at here: http://www.w3schools.com/css/css_reference.asp .
It shows that which CSS is supported by Which browser, right?
So I just wanted to ask you following:
Is Studying CSS2 practical for future when new browser supports CSS2 but still usuful to know them as some of CSS2 is already supported by browser well?
Am I right?
Steve, anyway I am picking up some info from CSS2 specification. I reckon it is worth reading.
Looking forward to hearing from you, guys.
Cya.
Hiroki Kozai
|
Dracusis
Maniac (V) Inmate
From: Brisbane, Australia
Insane since: Apr 2001
|
posted 04-19-2003 23:44
Learning CSS2 will indeed be usefull in the future but for now it's not a good practice becuse, like you said, some web browsers don't support it (namely IE6, which is the most widely used web browser).
As for trying to get an element an extra pixel or so higher, you could try setting negative values for the element margins. Something like: #myId {margin-top: -10px;} Will usually force an absolutly position element to sit 10 pixels higher than it's top:xxxx value, for an in-line non-block level element, it'll fold 10px back up the page, but be warned, it might cause some ugly overlapping and bizzare display problems. Sometimes the z-index values will let you control how things overlap, sometimes they won't, it's buggy in some browsers. Furthermore, when you set negative margins for in-line elements, it drags all of the preceding in-line elements (any element that appears after the one you set the negative margin rule for) with it.
As always, the best way to figure things out is just to play around and experiment with different.
|
Perfect Thunder
Paranoid (IV) Inmate
From: Milwaukee
Insane since: Oct 2001
|
posted 04-20-2003 00:01
When it comes to learning CSS, it's better to learn what works and what doesn't. Most browsers support many things from CSS2, just not everything.
A good tool is WestCiv.com's CSS Browser Support Reference.
|
Hiroki
Paranoid (IV) Inmate
From: NZ
Insane since: Dec 2002
|
posted 04-20-2003 06:36
Hi, guys. Thanks for your replies.
Many many thanks to you.
And if you don't mind, please see here and give me your opinions.
http://www32.brinkster.com/sanukiudon/1.htm
Many many thanks in advance.
Cheers,
Hiroki Kozai
|
Petskull
Maniac (V) Mad Scientist
From: 127 Halcyon Road, Marenia, Atlantis
Insane since: Aug 2000
|
posted 04-21-2003 17:52
alright, fellars-
I'ma go ahead and close this here thread 'cause it be gettin' kinda full (of nuts)..
The topic seems to be done, so I won't start a new thread, but feel free if you want to!
Code - CGI - links - DHTML - Javascript - Perl - programming - Magic - http://www.twistedport.com
ICQ: 67751342
|
