PDA

View Full Version : Table backgrounds with DW5.5


SilverAce
11-01-2011, 02:38 PM
Okay, so I have been looking everywhere for a good answer and also did a forum search to see if this was asked before. Here's my question-

I'm trying to set up a table and then put an individual background on it, yet I cant. Every time I try to edit the properties it only has a bar to select background color, not image. Then, I try to add a CSS rule to edit the background of it, and cant get anything.

Everywhere I look everyone says I should have a "select background image" option, but I don't. Anyone have experience with this problem? Thanks in advance!

Corrosive
11-01-2011, 02:44 PM
Have you tried giving your table an ID and then adding the background using CSS?

SilverAce
11-01-2011, 02:51 PM
Have you tried giving your table an ID and then adding the background using CSS?

You are a god. Thank you. Haha!

I'm smiling right now, I couldn't figure it out!:-D :-D :-D

SilverAce
11-01-2011, 02:53 PM
Real quick follow up question. How can I get a table to be aligned perfectly to the top of the page? I always feel like there is a small gap between the tables and walls. Thank you so much!

Corrosive
11-02-2011, 08:34 AM
You are not using Tables to lay out your website... are you?

The problem is default styles on the body tag. Try;

body {margin: 0; padding: 0;}

To zero out the default margins and padding.

SilverAce
11-02-2011, 01:49 PM
I am, haha. This is week 1 of webdesign, everywhere I looked said use tables. What do you suggest? this is my website I made like 2 days ago www.electroniccigarette-electroniccigarette.com it was all done on tables.

DWcourse
11-02-2011, 03:28 PM
You want to use divs for layout (or with html5 syntactical elements such as <header> <footer> etc.). A good place to start is by taking a look at the html and css in the built in layouts that are part of DW5.5.

SilverAce
11-02-2011, 03:44 PM
Okay, thanks DW. How did you think my website was? Was there anything you would change to make it better?

Corrosive
11-02-2011, 03:45 PM
What DWCourse said ;)

SilverAce
11-02-2011, 04:36 PM
If you don't mind me asking, what is the advantage of using more div's than tables? I find I can do most things with tables. Excuse me if that's a terrible question, I'm new, haha.

Corrosive
11-02-2011, 04:41 PM
If you don't mind me asking, what is the advantage of using more div's than tables? I find I can do most things with tables. Excuse me if that's a terrible question, I'm new, haha.

Here you go; http://www.hotdesign.com/seybold/index.html

Many reasons to favour CSS over inline/table layouts. Main one being you'll just get smashed in the Search Engine rankings by better coded websites. 30% of site builds are about visuals IMO.

SilverAce
11-02-2011, 05:26 PM
Awesome data Corrosive, thank you.

My one question was concerning the search engine rankings. Is the only thing that is different is the fact that it doesn't take the header tag the only thing that affects google, or are there other things?

Also, is there like a cheat sheet on the internet with codes for like header, footer and content. Thanks again guys.

SilverAce
11-02-2011, 05:39 PM
By the way, there were a ton of nice codes on that page and I found some sites, but I was wondering if there was any you all recommended.

Corrosive
11-02-2011, 05:49 PM
My one question was concerning the search engine rankings. Is the only thing that is different is the fact that it doesn't take the header tag the only thing that affects google, or are there other things?

No, there are other things. pages load quicker with CSS based layouts because the browser caches the stylesheet. Honestly, there are a load of good reasons not to use tables nowadays. Too numerous to go into as they have been discussed and re-discussed many times here and on the web in general.

You just need to trust us

Also, is there like a cheat sheet on the internet with codes for like header, footer and content. Thanks again guys.

As DWCourse says, DW has some built in layouts for you to use. There will be one that fits your layout no problem. This may help as well; http://www.corrosiveonline.co.uk/tutorials_css_floats_for_layout.php

It takes some learning but you'll get there.

SilverAce
11-02-2011, 06:01 PM
I trust you all, haha, I just wanted to know. I have been working on it, redoing the websites. It's not to difficult because using the CSS rules makes it pretty easy.

I went and looked up some HTML codes in conjunction with the CSS styles, it's not to bad.

SilverAce
11-02-2011, 06:03 PM
One last question - I'll use a scenario -

Say I wanted to put advertisements to the left and right of my content, how would I do that with div tags? For tables I just used columns and it was easy to do. It seems a little more difficult to separate (vertically) parallel images and keep them parallel.

Corrosive
11-02-2011, 06:07 PM
Read this...

This may help as well; http://www.corrosiveonline.co.uk/tutorials_css_floats_for_layout.php

SilverAce
11-03-2011, 07:15 PM
Corrosive, I have read your article, and learned all the aspects. My one question is - say I want a 3 column layout. Would I make 2 divs, float one left and one right. Then insert 2 divs into the right column, then float those left and right again? It should work, but seems like there must be a better way, correct?

Also, is it okay to use a table for menu buttons, or should I just throw a spry menu bar in there?

Corrosive
11-04-2011, 07:56 AM
Just make three divs. Float two left (left column and main column) and then one right. You can also float all three left or all three right. It has the same effect. Just do whatever suits your page/content structure the best.

SilverAce
11-04-2011, 09:35 PM
Worked like a charm Corrosive.

Corrosive
11-05-2011, 08:17 AM
Worked like a charm Corrosive.

Great news. No more tables for you then? Unless, of course, you are displaying tabular data :wink:

SilverAce
11-05-2011, 01:38 PM
Great news. No more tables for you then? Unless, of course, you are displaying tabular data :wink:

Well, that's what I asked in my last post, for a menu bar, should I Just float like 9 items left or use a table?

gentleone
11-06-2011, 03:09 PM
Well, that's what I asked in my last post, for a menu bar, should I Just float like 9 items left or use a table?
For menu/navigation you should use an unorderd list (ul tag) and to get the list items (li tags), thus your menu links, lined-up next to each other you can use 'float: left' or 'display: inline'. Which one depends on what you want to do with the links for styling.

Here is an old tutorial with loads of examples, but still usefull.
http://css.maxdesign.com.au/listamatic/index.htm

... or use a table
Once again, tables only if it is tabular data!
.

SilverAce
11-06-2011, 03:25 PM
Coolio Gent, thanks.

SilverAce
11-07-2011, 08:28 PM
Okay, Corrosive - I just did put up my site with div tags. Tell me what you think.
http://www.electroniccigarette-electroniccigarette.com/

On my to do list

-get header text or what ever it is that pops up on google
- make an icon for bookmarking the site
- make the columns expand to 100% the size of the content data (example of it not doing this is on the discount page.

This is my first site by the way, =).

Corrosive
11-08-2011, 06:13 AM
That's looking better now. I think your page width of 1300px is too wide for smaller screens or lower screen resolutions. You need to check that. Fixed width tends to be up to 960px and variable width should be in percentages.

Favicons can be generated here; http://tools.dynamicdrive.com/favicon/

SilverAce
11-08-2011, 03:02 PM
Okay, thanks a ton Corrosive, you've been a huge help! I might try a variable width website next! I will look into the favicons later today too.

Corrosive
11-08-2011, 03:05 PM
I might try a variable width website next!

Rather you than me... *yucky*

SilverAce
11-08-2011, 03:07 PM
Rather you than me... *yucky*

Oh man, are they a tough cookie?

Corrosive
11-08-2011, 03:13 PM
I find them hard (no great indicator for the general populous mind you). I also hate the way they look, especially on widescreen monitors. That said they are the best way to produce a mobile friendly site AFAIK but you gotta be careful. That's the main issue facing web today. Screens can go from 50" internet TVs down to smart phones...

Can open, worms everywhere ;)

SilverAce
11-08-2011, 03:21 PM
I find them hard (no great indicator for the general populous mind you). I also hate the way they look, especially on widescreen monitors. That said they are the best way to produce a mobile friendly site AFAIK but you gotta be careful. That's the main issue facing web today. Screens can go from 50" internet TVs down to smart phones...

Can open, worms everywhere ;)

Makes sense.

domedia
11-08-2011, 04:52 PM
That said they are the best way to produce a mobile friendly site A mobile phone will, if you have coded the mobile site properly, adjust the zoom level itself. In a sense, the screen resolution of the mobile phone does not matter. Someone wrote an excellent article about that, but I can;t find it now. Plus if you use responsive design, your CSS will also adjust to the available width. I really haven't seen anyone use a variable width web site for mobile.

Corrosive
11-08-2011, 05:01 PM
Plus if you use responsive design, your CSS will also adjust to the available width. I really haven't seen anyone use a variable width web site for mobile.

Ah, I think it was responsive design I was thinking of. Is that where columns and boxes etc almost 'fold' underneath each other to change the layout based on resolution? I have seen a site with JQuery used to do that somewhere.

Clever stuff... and I need to get my head around it for a client project pretty soon.

gentleone
11-08-2011, 07:11 PM
Clever stuff... and I need to get my head around it for a client project pretty soon.
I'd recommend to get a copy of the book Responsive Web Design, Toby. It's from the 'inventor' and it covers the whole theory behind it. Fluid grids, flexible images and CSS mediaqueries.
http://www.abookapart.com/products/responsive-web-design

Corrosive
11-09-2011, 11:02 AM
I'd recommend to get a copy of the book Responsive Web Design, Toby. It's from the 'inventor' and it covers the whole theory behind it. Fluid grids, flexible images and CSS mediaqueries.
http://www.abookapart.com/products/responsive-web-design

Thanks Ralph. I'll track down a copy on Amazon I think :)

Hobittual
11-20-2011, 04:00 PM
Hi Ace. I am new on here and I only started messing with this stuff in May. I found a bunch of tutorials on YT that as an amateur I found invaluable. Take a look at them. I am only one of the subscribers, he is nowhere near as popular as he should be:
http://www.youtube.com/user/zorro30mum
Best of luck with that.
Hob

SilverAce
11-20-2011, 09:24 PM
Thanks man, I did watch a ton of tutorials when I was learning it, I think I have a pretty good grasp now, haha =).