[Mistee]

Hello everyone!

I'm rather new to using css/xhtml. My knowledge of html is basic and my knowledge of css is even less. Though due to trying to make a css/xhtml website I have learned quite a bit of things! But I'm still having a LOT of trouble with a few things.

First off, the website I'm trying to make is a basic web graphics page. Just something I enjoy doing and wanted to put up. I'm by no means advanced in it, actually I'm quite a novice. Well anyways, so I've decided to make a website and I'm trying out the whole "website done completely in CSS" thing, which of course uses XHTML and Divs.

So that's where my trouble lies.

In the content of my layout, I'm using div layers with absolute positioning. But for some reason when the content expands (I add more), the layout goes all wonky and the layout itself does -not- expand with the text but makes a scrollbar (due to overflow:auto in the #faux code) and when I take overflow out, it stops scrolling, but the layout still doesn't move with the expanded content.

Here is a skewed link to my testing directory, since I am not allowed to post links as of now. I'm sorry if this is violating some sort of rule, but there's a lot I'm having problems with and I don't think I could explain it properly in order for you to help me. And I don't really know what to do or who to go to since none of my friends are html literate. ><

koiru*.net/zomg/testing/ (remove the *)

In the directory is (not counting the images

test - which contains how I would LIKE the content to look on my site, done in tables right now to show how I want to position stuff.

pagetest - This contains the messed up content with the div layers that I can NOT FIX for the life of me and it's really very frustrating, so frustrating I have actually -screamed-.

testmain - Which is my style sheet and contains all of my css that I'm using in the page.


Okay well, the test page and the pagetest page have different content, but it doesn't matter since it all does the same scrolling thing that it shouldn't be doing.

This whole thing has been driving me INSANE. And if it wasn't for this weird desire to make it XHTML valid, I would not even be worrying about this right now and I would have stuck with my tables.

But, if I'm going to do a CSS/XHTML layout (perhaps a few and put them up for download on my site), I want to do it -right-.


So, I hope someone here can help me. And since I'm really really new to all of this, odds are I might be confused at first with your answer, but I'm willing to try anything right now and I don't really want to resort back to tables, but if I can't get it fixed, I might have to.

I hope you can help me! <3

[babydutka]

Table Layout: ZOMG Graphics!
CSS Layout: ZOMG Graphics!
Stylesheet: http://koiru.net/zomg/testing/testmain.css

Ok So I'm not totally sure about this, but there is nothing in "leftcolumn" div...? You're closing it before those layout images appear. Those layout images are in a div with an absolute position and style of

style="z-index:1; position:absolute; left: 80px;

With nothing in the actual floated left column and the content you were hoping to have in there set with an absolute position, the right column is simply floating all the way to the left...

[pgo]

1. Forget "divs". This is the most common misconception for people switching to CSS based design. Everyone uses them, to be sure, but they're just another HTML element. They are nothing special. They don't "do" anything (which is why they're used). You could use <p> if you really wanted.

2. Use HTML properly and semantically. Instead of the meaningless <span class="heading">Resources</span>, you should use (surprise, surprise) one of the six heading elements - h1, h2, h3, h4, h5, h6! Imagine that.

3. Your problem is you're a novice using the most touchy and complex method of laying out a page (absolute positioning). You won't be successful until you learn the ins and outs of positioning and inheritance.

4. Forget "layers". That's a concept invented by Macromedia and I've never seen someone who uses them be successful.

5. Stop using <br /> to create whitespace and lay out elements.

6. Read every tutorial on HTML Dog.

[herkalees]

Originally Posted by pgo

1. Forget "divs". This is the most common misconception for people switching to CSS based design. Everyone uses them, to be sure, but they're just another HTML element. They are nothing special. They don't "do" anything (which is why they're used). You could use <p> if you really wanted.

2. Use HTML properly and semantically. Instead of the meaningless <span class="heading">Resources</span>, you should use (surprise, surprise) one of the six heading elements - h1, h2, h3, h4, h5, h6! Imagine that.

3. Your problem is you're a novice using the most touchy and complex method of laying out a page (absolute positioning). You won't be successful until you learn the ins and outs of positioning and inheritance.

4. Forget "layers". That's a concept invented by Macromedia and I've never seen someone who uses them be successful.

5. Stop using <br /> to create whitespace and lay out elements.

6. Read every tutorial on HTML Dog.

Seconded, immensely.

[mhillman159]

I personally use <div> tags and have no problems with them. I find them an easy way to move my items around the page where and when I need them to. I personally try and use floats more than positions but when the time is needed it has to be done which can get quite tricky. If your still having problems with your design give me a shout and ill be happy to look at it for you. :-)

[Bill Posters]

mhillman…

The point that pgo is making is that it's not wise to use div/span elements excessively or inappropriately.
If a particular design requires the use of a few, key divs to group or section off certain parts of the structure or layout, then that's fine.
However, the key is to start with good, semantic markup and then add divs sparingly when the layout requires it.
This way, you end up with semantic and efficient markup.


p.s. What's with your own site (applegatestudios.com)?
Not having a dig, but a web design/development services provider with nothing but a page of unrelated sales links up on their company domain isn't likely to fill people with confidence or show them just how good you really are. (Or perhaps, it does.)

[oli]

Originally Posted by Bill Posters

p.s. What's with your own site (applegatestudios.com)?
Not having a dig, but a web design/development services provider with nothing but a page of unrelated sales links up on their company domain isn't likely to fill people with confidence or show them just how good you really are. (Or perhaps, it does.)

Thats a domain holding page, he hasn't set up dns to point to hosting yet.