Jump to content
xisto Community
bureX

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

Recommended Posts

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:

 

Posted Image

 

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 by bureX (see edit history)

Share this post


Link to post
Share on other sites

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;}

Share this post


Link to post
Share on other sites

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--

Notice from whyme:
Please stop putting linebreaks where they are not needed. This is your second warning.

Edited by whyme (see edit history)

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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 :lol: )

 



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 by OpaQue (see edit history)

Share this post


Link to post
Share on other sites

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. :lol: 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.

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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 :lol: 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.

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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! :lol:

 

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 by bureX (see edit history)

Share this post


Link to post
Share on other sites

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. :lol:

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.