Click to See Complete Forum and Search --> : Total and utter novice...


tigrrboxer
11-05-2003, 03:11 AM
I loathe and despise code. No, I fear it. The only reason I uninstalled Dreamweaver was that I realized I was being cheated, stultified and limited by its WYSIWYG options, and it was time I stopped ordering from Pizza Hut and got to grips with yeast, flour, fresh tomatoes, garlic, olives, fresh mushrooms...

(short break while I drain the saliva off my keyboard)

To cut the crap, as we say in our galaxy, I've recently made feeble attempts to grapple with HTML and JavaScript. Now I've sadly concluded that only the most pathetic, lazy and cowardly designer would be moronic enough to cheat on CSS.

So please, please bear with my infantile and idiotic questions. S****** in private. I hate feeling stupid.

Okay, question #1:
What's with the "down with tables" and "no more tables with CSS" stuff? How does CSS remove the need for tables and why is this supposed to be cool? I LIKE tables :( Hey, I only just learned how to write them a few months back :D What exactly is floating? What's with the 3-column layout thingy which everyone seems to view as a utopia, but even an armadillo could create with HTML? (No offense to armadillos). You know, with a fluid center column etc. What's the "box" dialogue in Dreamweaver's CSS menu (I re-installed Dreamweaver to cheat in CSS but I promise I'll switch to NotePad if you help)? What's the @import directive ?? And I've asked this in the General forum, but what code editor/ design software do you recommend, bearing in mind that NotePad is too hardcore for an art director, Dreamweaver makes me lazy, and Photoshop makes me go all graphic and art director-ey and design pages that take up to 30 seconds to load...

I'll be back with my next question (let's pretend that was just one question, please, for my fragile ego's sake) in a few minutes...

Thanks!!

clairec666
11-05-2003, 04:42 AM
Hi
Firstly I suggest councelling, by the sounds of things you have lost your marbles, talk far too much crap, and have a dangerous addiction to pizzas....... :D (only joking)

Secondly, CSS is a far better option than tables - I haven't quite worked out the real reason for this but the code for my pages looked far neater with CSS. It takes a while to get used to - I was brought up on the 'table' thing until I found a decent book that taught me CSS.
Eg, when showing or hide <div>s with JavaScript, hiding it using "display = none" works much better than when you use it to hide a <td> or <tr> of a table
As for static tables, when you just use them for the main page layout, I secretly still use them (shhhhhhhhhh! don't tell the CSS purists :eek: ) because for my small brain it is so much easier than sorting out the absolute positioning etc.

Thirdly, nothing wrong with dreamweaver as long as you don't abuse it! After all, it shows all the coed + stuff in pretty colours :rolleyes: so you know exactly where you are, unlike in notepad when it just looks like a whole page of text and you have to plough through it to find what you want
What I mean by 'don't abuse it' is, when entering CSS, know exactly what you are putting in, so it is easier to manipulate with JavaScript/DHTML if you want that.

Aaaaaah, my brain hurst! Free me! :confused:

tigrrboxer
11-05-2003, 05:30 AM
Counselling's dangerous. Whatever you say/ do (chew your toenails, scream "Arnie for President!" or whatever), they nod calmly and tell you it's perfectly normal. Thus counselling ENCOURAGES aberrant behavior.

You use tables? You shouldn't have told me that...

Now: Classes. Can you invent any class name you like? Can I? Can you explain the whole class thing please?

What changed in CSS2? How do I know if the stuff I'm trying to learn is 1 or 2?

Who really does use their own user-defined style sheet which will render my Cool Style Stuff obsolete? How dare it take precedence over my awesome style?

Is it just me or do CSS-based pages load a ziliion times faster, INCLUDING GRAPHICS? Or have I been brainwashed already?

PunkSktBrdr01
11-05-2003, 06:19 AM
The main two reasons you shouldn't use tables for layouts:

1. They weren't meant for that purpose. They are supposed to be used to display tabular data. Tables were never meant for layouts.

2. Tables are not good for accessability. Alternative browsers, like screen readers for people with disabilities, can get really messed up on tables.

Read some of the other threads about this topic for more info. Always better to be standards-compliant! :)

clairec666
11-05-2003, 06:38 AM
Yep, you can choose any class name you want
Do you understand any of the class + id thing?
Classes can cover any number of <div>s
Id applies to a particular <div>

DaveSW
11-05-2003, 06:39 AM
If you want to know about CSS, the best place to find out really is the w3. I know you'll scream and run at this, but I'm telling you a 17yr old can understand it. (Usually anyway) :D

This is the CSS Spec.
http://www.w3.org/TR/CSS2/
I suggest you download the pdf and keep it in your my documents. It will tell you everything you need to know.

Additionally, you can go to www.w3schools.com and follow their useful css tutorials. This will get you started.

If you want to know more about css layouts, or css in general, I've answered most of the bacis questions at www.webdevfaqs.com and click the css link.

Hope this helps

Dave

clairec666
11-05-2003, 06:42 AM
Was that an attempt to insult 17-year-olds? :(
Damn, there's nowt wrong with us!

DaveSW
11-05-2003, 06:57 AM
Why would I want to insult myself? LOL :D

clairec666
11-05-2003, 07:00 AM
:D
Anyway, you can use me as an example of a 17yr old who CAN manage CSS!

DaveSW
11-05-2003, 07:03 AM
LOL ;)

Do you have a portfolio?

clairec666
11-05-2003, 07:06 AM
Nope, no portfolio.
Don't you remember that the official definition of a 17yr old is LAZY? :D

DaveSW
11-05-2003, 07:08 AM
LOL - as if!

I guess we'd better get back on topic LOL. Doesn't help if the moderators get off topic LOL!
So, err, any questions tigrrboxer? LOL

tigrrboxer
11-05-2003, 07:32 AM
I quote:
"Is your question an easy one? Check out www.webdevfaqs.com first! "

So, thinking I could avoid making a fool of myself, that was the first place I peeped. In fact, it was one of the main triggers that propelled me to delve a bit deeper.

Unfortunately, I'm also working fulltime (I have no connection at home), so while investigating CSS and being s******ed at by 17-year-olds, I'm also designing 6 websites (yes, I felt that collective wince - AT LEAST I'M TRYING TO LEARN ABOUT CSS - I'VE MOVED MY DEADLINE ON BY TWO WEEKS FOR THIS DAMN THING - and none of my clients have complained in the past, okay?), answering the phone, fixing the company's PCs, designing logos and posters and brochures and calendars and ads, photographing a 600-piece jewellery collection, eating icecream, translating every damn piece of junk mail my boss gets into English, installing things like Nokia cable drivers and Incredimail onto aforementioned boss' laptop, keeping the accounts, developing the company group's database, sneaking out for a smoke, performing extensive market research on every dumb product one of the partners decides to invest in (latest 2 brainwaves: e-scooters and Quik Clot), bla bla bloody-bla. OKAY?????????? They seem to think that knowing how to click on the IE icon makes me an entire team of various experts and I've got the bloodshot eyes and every known psychiatric disorder to show for it.

Oh and I'm brilliant, absolutely unrivalled, at getting off the subject and drivelling on for pages.

What does a: mean? It pops up every where. And how do they do that highlighted text link thingy?

clairec666
11-05-2003, 07:37 AM
As I said before, what's wrong with 17 year olds? I'm not that bad, am I? ;)

The a: thing refers to all the <a> tags in your html. For example, if you had the following in your stylesheet:
a: {
color: red;
etc.
}

that would make everything that is enclosed by <a> tags red. So you can manipulate it so that your hyperlinks have no underlining, etc. if this is how you prefer it.

Similarly, b: refers to all you <b> tags etc.

spufi
11-05-2003, 10:28 AM
Originally posted by clairec666
As I said before, what's wrong with 17 year olds? I'm not that bad, am I? ;)

The a: thing refers to all the <a> tags in your html. For example, if you had the following in your stylesheet:
a: {
color: red;
etc.
}

that would make everything that is enclosed by <a> tags red. So you can manipulate it so that your hyperlinks have no underlining, etc. if this is how you prefer it.

Similarly, b: refers to all you <b> tags etc.

I just want to clarify things. One, using names for colors is kind of looked down on as the way to define the colors for links. A better why is to define them using either the 6 digit version, or the shorthand 3 digit version. The 6 digit version looks like this.

color:#000000;

The 3 digit version looks like this.

color:#000;

The 3 digit version just repeats each number once. So #FFCC00 can be written like this #FC0.

About "b:" that's incorrect to a degree. Just using b will refer to all <b> tags. Lets say you want to define something bold as white text, this is how it is done.

b { color:#FFF; }

Now, using b: is when you are refering to something more specific such as when you want to change the properties of the first letter within the <b> tag.

b:first-letter { color:#FFF; }

spufi
11-05-2003, 10:55 AM
Originally posted by tigrrboxer
What's the @import directive ??

I don't think this was directly answered, so I'll cover it. This is one of two ways to bring in your CSS externally. You can code all of your CSS and put it in a file with a .css extension. You then can link to the page in your HTML file and your web page uses the CSS from that file. Pretty cool huh? This is by far the most recommended way for doing your CSS. Yes, you can define it within your <head> tag, or within whatever tag you need it to be, but it really goes against the biggest advantage of using CSS. This is also why CSS driven sites load faster. Since all of the layout/formatting is done in the extrenal file and is downloaded only once, a user isn't downloading all of that stuff(content/layout/formatting) when they load every page.

Back to why you use import though. Netscape 4.7 and earlier really sucks at using CSS. By using the import rule, you have Netscape 4.7 ignore your CSS all together. This maybe a good thing because it handling what it can might make your site look really funky looking. This also does mean that your site would be "boring" in an old browser, but that doesn't mean it wouldn't function. At least, it still should function. So here's the code for the two ways of linking to an external style sheet.

NN 4.7 ignores styles:

<style type="text/css" media="all">
@import "styles.css";
</style>

All browsers bring the external CSS file:

<link rel="stylesheet" title="Default" media="screen" href="styles.css" type="text/css">

toicontien
11-05-2003, 11:47 AM
This topic was covered in another forum. It's got tons of replies but read them all to get all the info.

http://forums.webdeveloper.com/showthread.php?s=&threadid=19830

I also started a thread a while back about the benefits of using XHTML in the real world. You may have heard of XHMTL (HTML with XML syntax) but not much of a reason why to use it. Check this thread out:

http://forums.webdeveloper.com/showthread.php?s=&threadid=18335

Once you're more familiar with CSS and HTML, head to http://www.alistapart.com/. It's got lots of great stuff on CSS, HTML, XHTML, XML, web design culture and more.

spufi
11-05-2003, 12:41 PM
Originally posted by toicontien
I also started a thread a while back about the benefits of using XHTML in the real world. You may have heard of XHMTL (HTML with XML syntax) but not much of a reason why to use it. Check this thread out:

http://forums.webdeveloper.com/showthread.php?s=&threadid=18335

I also have a HTML vs. XHTML link in my sig.

Robert Wellock
11-05-2003, 01:14 PM
Yes, I also have a beta site that serves XHTML as an application of XML rather than text/html to conforming user agents (however the hell spawned M$ IE 6.0, or old browsers cannot view the code correctly so I feed it nonsense) http://www.xhtmlcoder.com/beck/

tigrrboxer will this link help you: http://www.xhtmlcoder.com/css-coder.htm ?

DaveSW
11-06-2003, 07:02 AM
I like the CSS-coder link Rob, but maybe you could add some other alternatives for font-size? e.g. using % not pt?

Just an idea LOL.

Robert Wellock
11-06-2003, 09:12 AM
I abandoned the pages in my root directory during 1999 so that is why you'd see such odd things there like pt and table layouts and very sloppy structural Markup.

I became so disillusioned with the state of browsers during 1999-00 I quit improving the mark-up and left it as an abortion.

Though a webmaster from Spain has rights via my GLP Licensing to play with the idea and has done. http://www.ignside.net/man/misc/testcss/boxing.htm

DaveSW
11-06-2003, 09:31 AM
The spanish one looks interesting - just in the wrong language. I suppose the only really good way to make css easier to use would be to use an autocomplete type system, where you type in the first few letters and it fills in the rest for you... On the other hand, it's not a lot really faster than typing it yourself!