tutoring for CSS ?

[autocrat]

OK... I've been got by CSS... I revoke my dislike for it!
I think it has potential and could be used constructively!

I hate CSS!

I sat up till 5:30 odd this moring... simply trying to make a header with 3 images, a left end, center and right end.... so that ould put Hdr text infront of the center object etc.... seemed simple enough!

SO I think.... bkgrnd imgs.....inline....easy!
Yepp.... got the 3px bug!
Beat it in 2 mins.... obvious.... felt good!
I set the center to %
I now have a bar with a lft end, rght end and a stretching center!
GREAT
Not in NN6 I dont... only in IE6!!!!!!!
For some reason, have a % image in NN6 causes it to flicker!
Only find stuff about IE flicker... nothing on NN6.
WTF
So, I think rather than using divs, I'll try this span.... now I have nothing in NN6! IE is no different!
So I go back to div!
I turnb the center from % to px.
No flicker, (no shift either.. but hey!)

So, I put some txt in the center div to start the hdr text formatting....
my entire design just stuffed it!

The center image is now nolonger horizontally level with the ends! It's pushed downwards!
I've paddd the div... tried inserting another div within it... no difference! The txt stuffed it royally!

SO, from simple DIV for each to span for each within a hder div.... to no %, to no TXT as well!

CSS is not simple... nor fun! Still think it has potential, otherwise I wouldn't have sat there for hours trying!

So, the point of this thread.... can people provide or point to tutorials that actuially display code and examples of the results in real time for this sort of thing.... I can only find stuff for bugs (apart from the NN6 flicker! LOL)... nothing about inline images, creating flexible hdrs etc that use 3 images....

I think I will build a library of code... lots of little examples, with comments... then publish them as I go!

Atlest that way I KNOW what I've done, and maybe it wi;ll help others too!

[DaveSW]

Without seeing your code it's hard to comment, but personally I'd absolutely position the images in the top corners and just have them sitting on top of a div that fits the full width. Set margins on the middle one so the contents don't disappear under your edge ones.

[autocrat]

I'm trying to avoid the absolute stuff (along with z-index etc... to ensure more browser compatibaility!

Just cant understand why I can't simply have 3 divs with background imaes in a single row, containedin a div to centralise them.

I've gone through everything I could!

I've blasted throught the net for hours last night... zip!
Either I'm making some damn stupid and blatant mistakes... or trying stuff others don't!
Either is really going to get me annoyed - this is why I preffered tables! So much easier.
Yet CSS is bett.. I know it is... just more to learn and figure what the hell things are meant for!

Still... anything I figure out, I'll post in here.... atleast that way there is a reference point if others try something similar!

Further, is anybody else having issues with NN6 being a pain?
Ithough IE was the bugger... yet I can do what Il ike in that... works no matter what I try... it's NN6 that sems to sod it all up for me!

[DanceInstructor]

I think you should listen to DaveSW :p Don't get too caught up on an ideal or concept, this has caused me many problems in the past....

My biggest problems with CSS arise when I get caught up in how I think it should work, instead of trying to find out how it actually works lol.

Dance

[DaveSW]

As I remember it IE4 supports absolute positioning, so there's nothing bad in using it.

[ladeecache]

Autocrat ... I'm with ya!! I'm in the same boat. I'm in the process of learning CSS/XHTML and cross-platform/browser compatibility. Personally, I vote that everyone just convert over to Firefox, and then we'll all stop having these headaches.

Ok. My first question ... which version of HTML/XHTML are you using? I found out it matters .. if you're using XHTML strict or 1.1 *lots* of things will just disappear on you. If you're using HTML 4.x transitional, you'll be able to get away with a LOT.

Ladee

[autocrat]

html 4.01 strict... seems to be one of the more accepted modes/dovtypes.

Not sure about the khtml.... I just intend to keep the html to a basic, then see what it validates as! Seems the easiest way to ensure the correct dovtype to me! LOL

Well, theres a section on the forum for posting tutorials and such, I think I might type up all my little hint's tips etc. and post them there.... as well as useful links to cooour guides, examples, reference materials etc.

[DaveSW]

basically html transitional lets you get away with sloppy code, html strict means you have to do more via css to replace the attributes that they have removed. No real hardship!

[austinluthers]

Today there are so many websites available where you will find the great tutorial for learning CSS. As per the CSS concern i would like to suggest w3schools.com website where you can get the best tutorial for learning CSS. This is best website for you to learn CSS.