Div Vs Table Help

moyyom

New Member
Okay
So i've recently been working with someone who is a web designer.
We have been working on two seperate things. We've been working on the main site which i've only helped with a little. I've recently tagged along and came up with my own idea for an entirely new section of the site. I started creating the site. Uploaded everything, hooked up a MySql database, got all the PHP working that i need done, he taught me most of what i needed to know. I caught on real quick. But the main problem with my original skeleton was that i did it with Tables and hardly any CSS. it wasn't very cross browser compatible. He pretty much told me that I need to use more CSS and DIV boxes.

He said that everything can be framed out in CSS and the DIV boxes should just hold the skeleton. I was wondering if anyone here knew enough about CSS and DIV boxes that they could find me some info on how to do this. I can catch on real quick so I'm sure just some input from you guys would be beneficial. I don't need anyone to write up an entire tutorial. I'm pretty decent at web programming and I've been learning CSS. I know many other languages so this isn't hard for me to learn a new one at a quick pace.

Just wondering if anyone could help me out.

Thanks.
 

moyyom

New Member
That would be helpful although I've already found both of those sites. I need more specific help. Not just basic links pointing me towards what it is. I know what both are, I'm looking for more of what is in your signature. "Tables are for data, not layout!". I just can't figure out how to make a decent looking layout.

Heres what the site is:

I have all sorts of images stored in a MySql database, Along with info about the images and other stuff.

I want to load the image into a spot on the page and load everything in their respective places around it. The main problem(why i couldn't just use a basic table) was the the images are different sizes. I want everything to stretch around it...

If people could give me some more specific help, that would be awesome.
 

horrorshow75

New Member
W3schools is probably the best site to learn the ins and outs of html and css, there are tutorials up the ying yang there which is what i took your original post to mean, you wanted to learn how to effectively use html and css. You didn't state that you were looking for site specific help.

A link to your site or some code would be helpful so others here can take a look and maybe offer some alternative solutions.
 

moyyom

New Member
I'll provide a link to my site.
I've used W3 Schools before, but it's hard to learn from a site that is basically for broad help in html..

I was looking specifically for help along the line of just the DIV boxes. I know enough html and css. I was more specifically looking for a way of using DIV boxes(which i was told by someone is the most effective way of doing so)

I don't exactly have a link to the site because I'm using a home server. If i need more site specific help, i'll upload it to my server.

Although, If someone could give me specific help on how to embed an image inside of a div box that stretches, that would be helpful. I want to keep the code at a minimum..

I already have it so that I can embed the image and everything with my PHP echo functions and all that, but for some reason the boxes don't really like that and they stretch my stuff too much.

That didn't make much sense.

I use a background image, i've tried multiple ways of using images as the background of a table. I kind of want to use a rounded rectangle style of thing to make it look pretty profesional. Although the corners always get distorted and never look very good. How would I go about making the corners not get destroyed.
 

horrorshow75

New Member
Well your html would look something like this, keep in mind this is just an example

This will be the "skeleton" as your friend called it
Code:
<html>
<body>
<div id="wrapper">
<div id="head"></div>
<div id="nav"></div>
<div id="content">
<div id="img"><img src="images/image.jpg" alt="" width="" height="" /></div>
</div>
<div id="footer"></div>
</div>
</body>
</html>

You would then use css to position your divs, add color, etc. by using selectors
for example
Code:
#wrapper {
width: 790px;
margin: 0px;
padding: 0px;
}

#head {
width: 785px;
background: url(images/background.jpg);
}

Again these are just examples hope that helps.
 

flipboy

New Member
yeah divs/css are better than tables.
lynda.com has some tutorials that could maybe help you out.
I never used it but I heard it was good
 

moyyom

New Member
Thanks for the help guys. I'm going to go try some of that stuff out and see what I can come up with...
 
Top