My Home Page Just a home page for now...

Here is my Xisto-hosted home page:

 

http://forums.xisto.com/no_longer_exists/

 

Still just a home page, but I'm still building it so that I can have a template to use when other pages come along...

 

However, I am having some problems with Firefox (believe it or not)! While this page works perfectly in IE, Firefox is missing some background images and is handling tables badly.

 

Here is a screenshot of the problem:

 

 

The page is HTML 4.01 and CSS valid!

 

Here is the CSS file (all the links to the image files are valid):

.tablestyleright {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: normal;

line-height: normal;

font-weight: normal;

font-variant: normal;

text-transform: none;

color: #333333;

border-right: 1px solid #666666;

border-right-style: dashed

}

.tablestyle {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: normal;

line-height: normal;

font-weight: normal;

font-variant: normal;

text-transform: none;

color: #333333;

    border-style: solid;

border-width: 1px;

border-color: #CCCCCC

}

.imagestyle {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: normal;

line-height: normal;

font-weight: normal;

font-variant: normal;

text-transform: none;

color: #333333;

    border-style: dashed;

border-width: 1px;

border-color: #CCCCCC

}

.titletext {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

font-style: italic;

line-height: normal;

font-weight: bold;

font-variant: normal;

text-transform: none;

color: #666666

}

.menutext {

 

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: normal;

line-height: normal;

font-weight: bold;

font-variant: normal;

text-decoration:none;

text-transform: none;

color: #333333;

text-indent:4px;

}.cpr {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: italic;

line-height: normal;

font-weight: bold;

font-variant: normal;

text-transform: none;

color: #CCCCCC;

background-attachment: fixed;

background-image: url('images/footertile.gif');

background-repeat: repeat-x;

background-position: left top;

}

.headerimg {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

font-style: normal;

line-height: normal;

font-weight: normal;

font-variant: normal;

text-transform: none;

background-image: url('images/headertile.gif');

background-repeat: repeat-x;

background-attachment: fixed;

background-position: left top;

}

.windowtitle {

background-attachment: fixed;

background-image: url('images/titlebartile.jpg');

background-repeat: repeat-x;

background-position: left top;

font-family: Arial, Helvetica, sans-serif;

font-size: 18px;

font-style: italic;

line-height: normal;

font-weight: bold;

font-variant: normal;

text-transform: none;

color: #666666;

text-indent:6px;

}

http://forums.xisto.com/no_longer_exists/
Edited July 29, 2008 by bureX (see edit history)

My guess would be that maybe it's cos for .windowtitle and .cpr you've got background-attachment before background-image.
But really, your whole CSS is overbloated with lots of unnecessary stuff in there. I started out to explain what you should do to edit your CSS but found it was getting too complicated so have done an edited version for you. If you have any questions about changes I've made, fire away.

body {  font-family: Arial, Helvetica, sans-serif;	font-size: 12px;	color: #333333;}.tablestyleright {	border: 1px solid #666;	border-right-style: dashed;}.tablestyle {        border: 1px solid #CCC;}.imagestyle {    border: 1px dashed #CCC;}.titletext {	font-size: 14px;	font-style: italic;	font-weight: bold;	color: #666;}.menutext {	font-weight: bold;	text-indent:4px;}.cpr {	font-style: italic;	font-weight: bold;	color: #CCC;	background: url('images/footertile.gif') top left repeat-x;}.headerimg {	font-size: 14px;	background: url('images/headertile.gif') top left repeat-x;}.windowtitle {	font-size: 18px;	font-style: italic;	font-weight: bold;	color: #666;	text-indent:6px;	background: url('images/titlebartile.jpg') top left repeat-x;}

nice site but I do not like the layout at all but its a ok since its a business site or somewhat like that good luck with it .

whyme says: what is this space doing here?what is this space doing here?
what is this space doing here?
what is this space doing here?
what is this space doing here?
what is this space doing here?

==Mechvegita==

--the ultimate saiyan warrior--


Edited May 22, 2005 by whyme (see edit history)

From your code I see you made titlebarright.jpg an image by putting it in <img src> tags. If you want titlebarright. jpg become a bg on the part of the code where it says Anouncement,I think you must add the <td background=titlebarright.jpg> I don't work very much with css script. I do everything on hard code. I don't which browser has the problem but I can say that Firefox works well with tables. Try looking at some websites on IE and firfox I made: http://forums.xisto.com/no_longer_exists/. Click on the third link and you'll see what I mean.

Kool site

My guess would be that maybe it's cos for .windowtitle and .cpr you've got background-attachment before background-image.

But really, your whole CSS is overbloated with lots of unnecessary stuff in there. I started out to explain what you should do to edit your CSS but found it was getting too complicated so have done an edited version for you. If you have any questions about changes I've made, fire away.

 

body { �font-family: Arial, Helvetica, sans-serif;	font-size: 12px;	color: #333333;}.tablestyleright {	border: 1px solid #666;	border-right-style: dashed;}.tablestyle { � � � �border: 1px solid #CCC;}.imagestyle { � �border: 1px dashed #CCC;}.titletext {	font-size: 14px;	font-style: italic;	font-weight: bold;	color: #666;}.menutext {	font-weight: bold;	text-indent:4px;}.cpr {	font-style: italic;	font-weight: bold;	color: #CCC;	background: url('images/footertile.gif') top left repeat-x;}.headerimg {	font-size: 14px;	background: url('images/headertile.gif') top left repeat-x;}.windowtitle {	font-size: 18px;	font-style: italic;	font-weight: bold;	color: #666;	text-indent:6px;	background: url('images/titlebartile.jpg') top left repeat-x;}

143480[/snapback]

 

That's what I get when working with Macromedia Dreamweaver! I had loads of font properties where I didn't need them... I guess that that is the problem?

 

The new CSS code you posted is excellent! You shortened the whole thing, while keeping its functionality and solving the "background" problem!

I added a few lines of code to make it more functional:

 

1) I added the "text-decoration:none;" attribute to make the ".menutext" style appear without an underline when this style is applied to a text link. I also added "color: #3E3E3E" to set the color of the text.

 

2) The ".tablestyleright" style got this: "border-right: 1px #666;", because I only needed the dashed right table border!

 

I'm pretty much a beginner with CSS, so I rely on Dreamweaver to do the job for me sometimes...

 

What about the table problem in Firefox?

Does anybody have an idea what is causing the problem?

 

(BTW: You get a reputation point from me )

 

nice site but I do not like the layout at all but its a ok since its a� business site or somewhat like that good luck with it .

==Mechvegita==

 

--the ultimate saiyan warrior--

143487[/snapback]

 

Thanks!

 

From your code I see you made titlebarright.jpg an image by putting it in <img src> tags.

 

If you want titlebarright. jpg become a bg on the part of the code where it says Anouncement,I think you must add the <td background=titlebarright.jpg>

I don't work very much with css script. I do everything on hard code.

 

I don't which browser has the problem but I can say that Firefox works well with tables.

Try looking at some websites on IE and firfox I made: http://forums.xisto.com/no_longer_exists/. Click on the third link and you'll see what I mean.

143499[/snapback]

 

Yes, the "background" property was my first choice, but then the page is not a valid HTML 4.01. I will leave this as an plain image because I won't need to write anything in the table cell where this image resides.

 

Kool site

143506[/snapback]

 

Thanks!

Edited September 20, 2016 by OpaQue (see edit history)

What about the table problem in Firefox?Does anybody have an idea what is causing the problem?
(BTW: You get a reputation point from me )

Thanks for that. Had another look at your site and it seems like now the problem in FF is the opposite of what it was before (different bit not showing the background). Why don't you try removing the second <td>? Instead, just have:

<tr>            <td width="100%" class="windowtitle">Announcement</td>          </tr>

I don't really see why you'd need to have it there. If it's so the content in the row below doesn't butt up against the right edge of the table, you could get around that problem by giving that <td> a class and adding some padding-right to it.

This is a temporary fix but it should allow FireFox visitors to come to your site. First you create a Fire Fox compatable website in Microsoft Word or Frontpage. Second you create a homepage for your site that could say "IE Users Click Here" and FireFox Users Click Here" all people would be able to come to your site and you would be able to fix and bugs without rushing. I haven't tried this but it seems like a great idea.

who cares if it's valid css? you should only care if it works..

This is a temporary fix but it should allow FireFox visitors to come to your site. First you create a Fire Fox compatable website in Microsoft Word or Frontpage. Second you create a homepage for your site that could say "IE Users Click Here" and FireFox Users Click Here" all people would be able to come to your site and you would be able to fix and bugs without rushing. I haven't tried this but it seems like a great idea.

I'm sorry, but I think that's a dumb idea. It doesn't take that much work to get it to work for both browsers. By giving users two different options you a) have to do twice as much work whenever you're updating and raising a flag that you've got problems with your coding that you couldn't find a solution for.

who cares if it's valid css? you should only care if it works..

Well actually, I do. I don't do sites that aren't completely valid XHTML/CSS.

To mods...only making this post cos I can't edit my post above. I was making 2 points a) and b ), but it turned b ) into a smiley.

Hey, Nice site. Your headers are a lill big, but thats ok. That can stay, but you need to fix the alignment. Your "Announcements" header isn't aligned with the rest. And your header is very nice. I only have one more suggestion, and thats I'd put a navigation bar at the top. It's personal preferance, but it be easier to follow the page with a top bar or somthing. Good Luck!nickmealey

it's pretty good i got the same view on fire or windows ie..what cms u r using to creat?it's just simple ^ good stly.

Yippee! I solved the problem! Here it is:

 

This is my "titlebar" image in the first version:

<p><img src="images/svere.jpg" alt="SuWireless"></p>

I deleted the <p></p> tags because I didn't need them (and I didn't notice them before)! Internet Explorer has ignored them and crammed up my image in one table cell.

 

Firefox was respecting the use of the <p></p> tags and added some extra space between the table cells (that was my problem).

 

Now, the whole thing works perfectly!

Thanks guys!

 

Well actually, I do. I don't do sites that aren't completely valid XHTML/CSS.

143690[/snapback]

Plus, you get to have the cool "HTML 4.01 Valid!" button on your site!

 

Hey, Nice site. Your headers are a lill big, but thats ok. That can stay, but you need to fix the alignment. Your "Announcements" header isn't aligned with the rest.

143726[/snapback]

Thanks!

And about the alignment problem:

Yes, I know, thanks for reminding me . I just can't manage to align them together!

 

I only have one more suggestion, and thats I'd put a navigation bar at the top. It's personal preferance, but it be easier to follow the page with a top bar or somthing. Good Luck!

nickmealey

Yes, I will put in a navigation system, but I think the easiest one will be to put the "Back" and the "Home" button on the page top somewhere, and use something like this next to it:

 

"You are here: SuWireless>Registration>Finish"

 

it's pretty good i got the same view on fire or windows ie..

what cms u r using to creat?

it's just simple ^ good stly.

143737[/snapback]

I don't use any kind of CMS programs like Mambo and phpNuke (and I never have).
Edited July 29, 2008 by bureX (see edit history)

It;s okay. I don't like the layout because it's too big and chunky for me.. I like thinks petite.. probably because I'm female but lol who cares.Well the navigation highlites definately doesn't color co ordinate with the layout and when you click on it.. they knd of go red which is totally out of color..It's really nice and simple though.. and simple to navigate. It's not over crowded with TONS of graphics (graphic heavy) which is cool and loads pretty quick.. plus I think the resolution works for most screens.