14 replies [Last post]
sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

I'm having some trouble with my new site design. This is my first real go at CSS, and I didn't find it too bad other than the few problems I'm having now.

1) One of the pages, for a newspaper article, can be laid out successfully with tables in Internet Explorer, but doesn't work in Firefox. I've tried a CSS layout, but couldn't get the image positioning correctly.

2) The menus are not showing up correctly in Internet Explorer.

3) The page is centered in Firefox(margins: auto), which isn't working in Internet Explorer.

If it helps to look at it, the url is http://www.candlepincentral.com/design/pinchatter.php?id=1
The page mentioned in (1) is under Pin Chatter -> Oct 22, 2007

Please don't mind the lack of banner(filled by a spaceholder for now)... my new banner is being designed.

Thanks.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

I should note that the

I should note that the reason I am using a table for the news article(Pin Chatter) is because if I don't, it cuts the horizontal line off, which I don't want.

I've also fixed the menus and centering in IE.

Triumph (not verified)
Anonymous's picture
Guru

sheppjr wrote:I should note

sheppjr wrote:
I should note that the reason I am using a table for the news article(Pin Chatter) is because if I don't, it cuts the horizontal line off, which I don't want.

That's not a good enough reason.

Now listen, I'm going to be totally honest with you. I don't think anyone here is going to bother looking at your page without you validating the code. Frankly, it's in bad shape.

Not only do you not have a doctype, the style section is before the html and head. Go ahead and read the stickies at the top of the forums, validate your code, then ask.

Just trying to help.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:sheppjr

Triumph wrote:
sheppjr wrote:
I should note that the reason I am using a table for the news article(Pin Chatter) is because if I don't, it cuts the horizontal line off, which I don't want.

That's not a good enough reason.

Now listen, I'm going to be totally honest with you. I don't think anyone here is going to bother looking at your page without you validating the code. Frankly, it's in bad shape.

Not only do you not have a doctype, the style section is before the html and head. Go ahead and read the stickies at the top of the forums, validate your code, then ask.

Just trying to help.

The style section is before the HTML/HEAD because of the include calls for PHP. I moved it, and it went from 19 errors to 46 errors.

I tried adding a DOCTYPE tag, which I have no clue about, and went from 46 errors to 56 errors. I can really use some help with this stuff... I've never used a page validator before, so I'm not sure what all is needed.

Triumph (not verified)
Anonymous's picture
Guru

OK, good. That was mainly a

OK, good. That was mainly a test to see if you were expecting us to recode your site for you. Please understand that some people come here and expect us to do all their work as if we are a coding service. Smile

First thing I would look at is the made up tags

You can't just make up tags using HTML. Let's get that cleared up first.

Then I'd probably dump the table and the font tags. Both are totally unnecessary.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:OK, good.

Triumph wrote:
OK, good. That was mainly a test to see if you were expecting us to recode your site for you. Please understand that some people come here and expect us to do all their work as if we are a coding service. Smile

First thing I would look at is the made up tags

You can't just make up tags using HTML. Let's get that cleared up first.

Then I'd probably dump the table and the font tags. Both are totally unnecessary.

I originally had it set up this way for those, but the page validator complained about it:

<\a href="#" class="subhead"><\div id="subhead1">Text<\/div> > <\/a>

And that gave me the proper format I wanted, where my text was aligned to the left of the menu, while the > characters were aligned to the right.

I made up because using in my menu wouldn't give me a proper seperator/spacer.

Also, I can't figure out why the validator is complaining about this line:
<\hr color="#BBBBBB">

Triumph (not verified)
Anonymous's picture
Guru

It seems you have some

It seems you have some misconceptions on the basics.

Alluding to the code snippets in your last post, an ID can occur only one time on a page and there is no color attribute available for the HR tag.

The validator gives very specific reasons why it rejects the code it rejects. If it says "There is no..." then don't use that tag or attribute.

Also, it looks like you have some block level elements (such as DIV) inside of a line level element (such as A). This can not occur in valid markup.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:It seems you

Yay! I got all the errors gone, and the page is still working the way I want. Well, all the errors that aren't on the statistics pages I grab from other sites... like the 412 errors in one of the league standings pages.

Now if I could just get that stupid news page to work.

Triumph (not verified)
Anonymous's picture
Guru

sheppjr wrote:... Now if I

Nice work. You're working very hard at this and are to be commended.

sheppjr wrote:
... Now if I could just get that stupid news page to work.

I'm sure someone can help as soon as you get rid of the unnecessary table and font tags. Smile

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:Nice work.

Triumph wrote:
Nice work. You're working very hard at this and are to be commended.

sheppjr wrote:
... Now if I could just get that stupid news page to work.

I'm sure someone can help as soon as you get rid of the unnecessary table and font tags. Smile

Okay... I got rid of the font and table tags... now you can see what I mean about the page footer being cut short(to the left of the image).

The table forced it to square the page... is there another way to do this?

Triumph (not verified)
Anonymous's picture
Guru

sheppjr wrote:Okay... I got

sheppjr wrote:
Okay... I got rid of the font and table tags... now you can see what I mean about the page footer being cut short(to the left of the image).
It's much better than it was with the table:
With table:

And without the table:

sheppjr wrote:
The table forced it to square the page... is there another way to do this?

Try doing this:hr {
color: #BBBBBB;
clear: both;
}

I don't know if it will work because of the presentational markup. Basically, you're going in two directions at once. On one hand you are trying to do the right thing by using CSS for your styling and layout and on the other hand you've got things like align="right" on your image. That would be best placed in the styling as well.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:sheppjr

Triumph wrote:

I don't know if it will work because of the presentational markup. Basically, you're going in two directions at once. On one hand you are trying to do the right thing by using CSS for your styling and layout and on the other hand you've got things like align="right" on your image. That would be best placed in the styling as well.

I tried to get the align="right" to work in the styling, but the text wasn't properly wrapping

Triumph (not verified)
Anonymous's picture
Guru

sheppjr wrote:I tried to get

sheppjr wrote:
I tried to get the align="right" to work in the styling, but the text wasn't properly wrapping

The CSS equivalent is float: right;

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Triumph wrote:sheppjr

Triumph wrote:
sheppjr wrote:
I tried to get the align="right" to work in the styling, but the text wasn't properly wrapping

The CSS equivalent is float: right;

Thanks for the help Triumph.

Now... I got my first go with submenus working on a fluke, and I'm trying to extend them now but can't. I want to make it so when you go over "Leagues" it drops down, you go over the center, it pops out, then go over the league and it pops out with a meanu offering Schedule, Standings, and Rosters.

Basically, I need to add 1 more level of submenus but I'm not sure how.

sheppjr
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2007-10-23
Posts: 12
Points: 0

Is there any way to open a

Is there any way to open a submenu on the left of the menu?

I'd like to make it so my Links submenus open to the left to avoid possibly going outside the set area.