Closing table borders

[F.C. James]

I have worked with this all day and for some reason I can't get the top
of the four columns 11, 22, 33 and 44 to close the gap between the top
of them and the bottom of the header. I don't have any borders,
cellspacing or margin. Why is the backgound bleeding through ?

http://ride.0taxi.com/downyonder/

 

[Beauregard T. Shagnasty]

I have worked with this all day and for some reason I can't get the
top of the four columns 11, 22, 33 and 44 to close the gap between
the top of them and the bottom of the header. I don't have any
borders, cellspacing or margin. Why is the backgound bleeding
through ?

http://ride.0taxi.com/downyonder/

You have too many errors to make an accurate judgment. HTML:
<http://validator.w3.org/check?verbose=1&uri=http://ride.0taxi.com/downyonder/>

Paste your CSS here:
http://www.htmlhelp.com/tools/csscheck/

New pages should be Strict, not Transitional, and you shouldn't be
coding in 1995-style markup.
http://htmldog.com/

 

[the red dot]

I have worked with this all day and for some reason I can't get the top
of the four columns 11, 22, 33 and 44 to close the gap between the top
of them and the bottom of the header. I don't have any borders,
cellspacing or margin. Why is the backgound bleeding through ?

http://ride.0taxi.com/downyonder/

did you design it for 1024px or wider , and have you tried reducing the size
of the window to see what happens to the content?

 

[F.C. James]

F.C. James wrote:




You have too many errors to make an accurate judgment. HTML:
<http://validator.w3.org/check?verbose=1&uri=http://ride.0taxi.com/downyonder/>

Paste your CSS here:
http://www.htmlhelp.com/tools/csscheck/

New pages should be Strict, not Transitional, and you shouldn't be
coding in 1995-style markup.
http://htmldog.com/

I got a lot of warnings because of my use of "background" and
background-color"

So I went to html dog for guidance and they gave me this --

http://htmldog.com/guides/cssintermediate/classid/

#top {background-color: #ccc; padding: 1em}

..intro {color: red; font-weight: bold;}


So I checked it at

http://www.htmlhelp.com/cgi-bin/csscheck.cgi

And got these warnings.

-----------------------------------------------

#

#top { background-color: #ccc; padding: 1em}

Warning: To help avoid conflicts with user style sheets, background and
color properties should be specified together.
#

#top { background-color: #ccc; padding: 1em}

Warning: To help avoid conflicts with user style sheets,
background-image should be specified whenever background-color is used.
In most cases, background-image: none is suitable.
#

background-color: #ccc

Warning: The shorthand background property is more widely supported than
background-color.
#

..intro {color: red;font-weight: bold;}

 

[F.C. James]

did you design it for 1024px or wider , and have you tried reducing the size
of the window to see what happens to the content?

I squashes it up pretty bad but it doesn't do anything about those white
spaces.

 

[Beauregard T. Shagnasty]

These errors should probably be addressed prior to CSS warnings.

I got a lot of warnings because of my use of "background" and
background-color"

A warning isn't an error. "brown" is an error, according to the checker.

So I went to html dog for guidance and they gave me this -- ...
And got these warnings.
Warning: To help avoid conflicts with user style sheets, background and
color properties should be specified together.

I would not dwell on these warnings for now. The HTML errors are a lot
more important, and should be looked at first.

Who can you trust ?

Our mothers?

Oh, I notice another inconsistency. You have mixed serif and sans-serif
fonts, and haven't assign the generic fallback.

body { ... font-family: Georgia, Arial, Helvetica; ... }

font-family: Georgia, Times, serif;
or
font-family: Helvetica, Arial, sans-serif; (less-common first)

 

[F.C. James]

F.C. James wrote:




A warning isn't an error. "brown" is an error, according to the checker.
<g>

OK, I feared disaster.

I would not dwell on these warnings for now. The HTML errors are a lot
more important, and should be looked at first.

It's embarrassing to collect that many warnings on background alone.
What would be the correct way of making these two statements ?

#name1 {height: 450px; padding: 0; margin-left: 10px; border-bottom:
solid #A79372 5px; background-image:url('col.jpg');}

body{background:#DDFFFF ; font-family: Georgia; font-size:100%;}

 

[Beauregard T. Shagnasty]

OK, I feared disaster.


It's embarrassing to collect that many warnings on background alone.
What would be the correct way of making these two statements ?

#name1 {height: 450px; padding: 0; margin-left: 10px; border-bottom:
solid #A79372 5px; background-image:url('col.jpg');}

body{background:#DDFFFF ; font-family: Georgia; font-size:100%;}

body {
background: #dff;
color: #000;
font: 100% Georgia, serif;
}

#name1 {
height: 450px;
padding: 0;
margin-left: 10px;
background: transparent url('col.jpg');
color: #000;
border-bottom: solid #a79372 5px;
}

What is the purpose of "#name1" ? If for holding text, I would switch
to using em units for the height and margins, so that the container
expands and contracts with the text if/when a visitor resizes.

 

[F.C. James]

F.C. James wrote:

body {
background: #dff;
color: #000;
font: 100% Georgia, serif;
}

#name1 {
height: 450px;
padding: 0;
margin-left: 10px;
background: transparent url('col.jpg');
color: #000;
border-bottom: solid #a79372 5px;
}

Thanks a lot. That does look a lot better.

With those corrections, I can now copy and paste the css into the
validator and I get "NO" errors. If I use the url I still get 16
I'll try and clean up the HTML next.

What is the purpose of "#name1" ? If for holding text, I would switch
to using em units for the height and margins, so that the container
expands and contracts with the text if/when a visitor resizes.

I'm not sure I understand. One bad problem I have is that the text in
the middle table will not stay within the table border to the right when
I resize the browser to 800. I've not seen this happen before. But I
will try and experiment with the em and see if it works.

http://ride.0taxi.com/downyonder/

 

[Adrienne Boswell]

I squashes it up pretty bad but it doesn't do anything about those
white spaces.

You are using/abusing tables for presentation, not for tabular data.
You have white space in your markup, eg:
</tr> <tr> <td>

My crystal ball is in the shop, so that's the best I can do without it -
a URL would help.

 

[F.C. James]

Gazing into my crystal ball I observed "F.C. James"
<[email protected]> writing in


You are using/abusing tables for presentation, not for tabular data.

I wanted to use divs, but the tables offer a more stable tool when the
screen is re-sized down to 800. It seems to me divs would be much
easier to work with if everybody used the same size browser screen.

You have white space in your markup, eg:
</tr> <tr> <td>

Thanks. I looked at that for two hours and missed it.

My crystal ball is in the shop, so that's the best I can do without it -
a URL would help.

The url is above --

http://ride.0taxi.com/downyonder/

But I have changed it now. It's a mock up site I use for tests. I
re-did it from scratch. It's just a design idea I was kicking around.