XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. XOOPS Themes and Templates Support forums / 
  3. Theme design questions 
  4.  / Working on my first non-table theme, basic div/span question(s)
Register
1
dukehen
Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 0:06

  • dukehen

  • Just popping in

  • Posts: 91

  • Since: 2003/12/9


Alright, I am reading up on <DIV>'s and <SPAN>'s, and am wondering what the best approach would be to accomplish this goal:

In the past, I have relied on tables to organize my pages, but after reading up on DIV's, and my already overriding preference to use CSS, I have decided to make the switch. Instead of converting (which I am leary of), I want to start fresh on a new theme.

Here is what I want to start with.

For my theme, I have a main table (which will now be a div, no problem there) and inside of it I usually have multiple tables.

My confusion lays around arraying objects in a horizontal line. Now, I understand that DIV's are block elements, whereas SPAN's sit inline. Keeping this in mind, this is what I would do with tables for my top piece:

I would have a table, with let's say 3 data cells (columns). The 1st and 3rd (or left and right) will be fixed width of let's say 200 pixels, and the middle is set to 100% to accomodate users with larger resolutions.

Now, with DIV's, what would be the best way to accomplish this? With 3 DIV's that are absolutely positioned beside each other, or with SPAN's, or some other way?

Which ever way is best, if you could post example code, I would appreciate it!

Thanks!
2
ajaxbr
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 1:34

  • ajaxbr

  • Quite a regular

  • Posts: 276

  • Since: 2003/10/25


Check the layout section on CSS Vault, those links lead to plenty of examples and tutorials.
Good luck and thanks for your work!
3
dukehen
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 3:33

  • dukehen

  • Just popping in

  • Posts: 91

  • Since: 2003/12/9


Thanks. I think I have already found what I need, boy do I find working with divs much easier than tables...
4
studioC
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 7:30

  • studioC

  • Friend of XOOPS

  • Posts: 922

  • Since: 2003/12/7


hello dukehen ,
nice to see more and more people here on xoops.org looking and thinking about that topic. Once started, there are amazing solutions for nearly all things, all people told before could only solved with the usage of tables.

And, as you mentioned ...
Quote:
do I find working with divs much easier than tables...

You will have to make some exercises, but it makes fun, source is better, easier to read, you can easily serve different media, and they are faster!, and .., and .., and ..

Have phun and keep on your work ..
michael

http://xoopsfactory.com

5
tjnemez
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 10:49

  • tjnemez

  • Home away from home

  • Posts: 1594

  • Since: 2003/9/21


hey dukehen,

you may want to test your theme with ie6, firefox and opera as you develop it.
6
dukehen
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 11:39

  • dukehen

  • Just popping in

  • Posts: 91

  • Since: 2003/12/9


@studioC: Thanks for the encouragement. I still have your xf_cssbasic theme that helped serve as the inspiration for me to stop working with tables and step it up to using a more refined approach. I will take this opportunity to thank YOU again... :)

@tjnemez: Thanks for the suggestion. I always check for glitches in my themes in IE6, Firefox, Netscape7, and Opera. That being said, I don't get too broken up initially if things aren't working in IE...such a terrible browser. ;)

Thanks again!
7
Stewdio
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/6 13:04

  • Stewdio

  • Community Support Member

  • Posts: 1560

  • Since: 2003/5/7 1


I'm not sure how I can help in this area. I hate tables, I can't stand trying to design things and generaly feel intimidated even trying. Editing existing stuff I'm ok with, but still run into troubles when tables break and all that. My point is that if .css is the real way to go for the future, then I too may start learning more on how to achieve this and start designing on my own.

With my 2 cents aside, here is a link that you guys might find usefull. It's a program that will design your layout in CSS. It's free and seems to work good.

I know how much those of you who have posted in this thread so far like to work with CSS, so I hope you get something usefull out of this.

Price Media has a few different software packages, but you all may want to check out a program called Cascade DTP.

It's free and I would like to hear your feedback on it. You all have great skills and I would look forward to seeing what you can develop for the CSS community and the XOOPS community at large.

Happy XOOPSing!
8
dukehen
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/7 15:11

  • dukehen

  • Just popping in

  • Posts: 91

  • Since: 2003/12/9


Thanks Stewdio, I have downloaded the program and am using it now - definately helped me at the start learning some more CSS attributes relating to layers.

So, I have created my header that will sit atop my theme. Still not completely finished, but you will get the basic idea if you follow the link at the bottom of the page.

I have noticed that in IE the first DIV, the silver top gradient div doesn't display properly, but I am not going to worry about that now, just want to be aware of it. Thanks

BTW, using layers is SOOO much better than tables. I am converted! I won't be using tables anymore unless I absolutely have to.

http://www.paintballandstuff.net/themes/alter/base/theme_header.html
9
Anonymous
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/7 18:58

  • Anonymous

  • Posts: 0

  • Since:


Thanks for bringing this topic to light. I have been wanting the same thing and it is good to see others who are working on it...Gives me inspiration as I have a big learning curve.

So far so good
10
Anonymous
Re: Working on my first non-table theme, basic div/span question(s)

  • 2004/6/7 19:01

  • Anonymous

  • Posts: 0

  • Since:


studioC,

Nice website. I like your design.

One thing I noticed though and I dont know if this is just the nature of css or what but I noticed that if you have a larger screen it seems everything is squooshed into the middle and on smaller screens the page seems to span across the screen....

I guess I dont like having everything in the middle with so much left on the sides of the screen...

Hope that made sense

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Who's Online

126 user(s) are online (64 user(s) are browsing Support Forums)

Members: 0

Guests: 126

more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: May 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits