The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> CSS and Firefox not talking
Kifebear
post Mar 6 2007, 06:16 PM
Post #1


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



Herei s the site I am working on:

http://www.maxwho.com/

What is happening is that in IE6 the left navigation in the gray bar, the text is indented a little bit. Using firefox, the text is up against the far left of the gray bar. This is the css code that is messing it up:


.category ul li{
color:#333333;
font-size:9pt;
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
text-decoration:none;
list-style-image: none;
list-style-type: none;
list-style-position: inside;
line-height:11pt;
text-indent: 0px;
}


When I change the text-indent: 0px to 10px in firefox the text indents a little. In explorer, it pushes the gray box out 10 pixels. Argh! What the heck?

Thank you to any brave soul who wants to help me figure this out. smile.gif

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 6 2007, 06:25 PM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



I recommend that you start by fixing the HTML errors and the CSS errors reported by the online tools.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 6 2007, 06:29 PM
Post #3


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



Thank you for that advice, I will start there. smile.gif Looks like I have got a bit of work to do.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 6 2007, 07:11 PM
Post #4


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



I just realized that a lot of the HTML errors reported by the validator are caused by the doctype declaration coming after the <html> tag. The doctype declaration needs to be the first thing on the first line.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 6 2007, 07:34 PM
Post #5


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



I managed to clean up the css. But when I tried to take out the <html> before the Doctype things were out of line in firefox and in explorer my search box was stretched. Also my top right buttons moved over to the far right.

Where should I put the <html> if it isn't before the Doctype? Am I using the right Doctype?

There are no longer errors showing up on the CSS validation but my links still go all the way to the left of the gray nav bar. Must be something with my html validation errors.

On the html validation errors...What does it mean when it says "start tag was here"?

Thanks again for all of your help!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 6 2007, 08:23 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,733
Joined: 9-August 06
Member No.: 6



QUOTE(Kifebear @ Mar 7 2007, 01:34 AM) *

Where should I put the <html> if it isn't before the Doctype?

After the doctype. smile.gif
http://htmlhelp.com/reference/html40/structure.html#doc
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 6 2007, 08:29 PM
Post #7


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,733
Joined: 9-August 06
Member No.: 6



QUOTE(Kifebear @ Mar 7 2007, 01:34 AM) *

I managed to clean up the css. But when I tried to take out the <html> before the Doctype things were out of line in firefox and in explorer my search box was stretched. Also my top right buttons moved over to the far right.

Browsers don't see your doctype where you've hidden it. They display your page in Quirks Mode, same as if you didn't use a doctype at all. When you correct that they go into Standards (or Almost Standards) Mode.
http://hsivonen.iki.fi/doctype/
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 6 2007, 09:24 PM
Post #8


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



FWIW, when I open the page in my browser, I get a series of security warnings:
QUOTE
The server is using a short public encryption key, which is considered insecure.


Since you provided an http:... URL rather than an https:... URL, I was confused. Then I noticed that you're using
CODE
<BASE HREF="https://maxwho.com/mm5/">
which makes all your relative URLs into https:... URLs. Is there a particular reason for this? It sure looks ugly to me, even ignoring issue of the short public encryption key.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 7 2007, 12:15 PM
Post #9


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



QUOTE(Darin McGrew @ Mar 6 2007, 09:24 PM) *

FWIW, when I open the page in my browser, I get a series of security warnings:
QUOTE
The server is using a short public encryption key, which is considered insecure.


Since you provided an http:... URL rather than an https:... URL, I was confused. Then I noticed that you're using
CODE
<BASE HREF="https://maxwho.com/mm5/">
which makes all your relative URLs into https:... URLs. Is there a particular reason for this? It sure looks ugly to me, even ignoring issue of the short public encryption key.


The reason for my https base href is because the rest of my site needed that. The rest of the website uses Miva Merchant which is difficult to make url's simple. Here is the index page in using the Miva Merchant https://maxwho.com/mm5/merchant.mvc?Screen=...mp;Store_Code=M. Would it help if I made the url's

I changed the base href to http instead of https for that page, but I need to leave it https for the rest of the site using miva. Hopefully that looks better.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 7 2007, 12:33 PM
Post #10


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



I changed the doctype to above the html and now it looks funky. If you look at http://www.maxwho.com in explorer... the search box is completely to the left and the buttons in the top gray bar are all the way to the right. In firefox, this page is a huge mess and I don't understand why. You can see that the content has completely left the screen. All the way to the right.

This is how the beginning of my index page looks:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<HEAD><TITLE>Maxwho.com</TITLE><meta http-equiv="Content-Language" content="en-us"><meta name="Author" content="Maxwho.com"><meta name="keywords" content="Electronics Accessories, Sansa MP3 players, MountMaster TV Mounts, Made For Sansa Accessories, Bluetooth Headsets, Playseat Racing Seats, Plantronics Bluetooth Headsets, Tekkeon Bluetooth Headsets, AudioBUG FM Transmitters and Accessories, Etymotic Earphones, Actiontec VoSKY, and SKYPE Phones."><meta name="description" content="Welcome to Maxwho.com! Your best source for portable accessories, electronics, and cables. We carry Plantronics, Tekkeon, AudioBUG, Etymotic, MountMaster TV Mounts, Made For Sansa Accessories, Bluetooth, Playseat, and Sansa MP3 players!">
<meta name="copyright" content="Copyright &copy; 2007 Maxwho.com. All rights reserved."><BASE HREF="http://maxwho.com/mm5/"><link href="CSS/maxwhoCSS.css" rel="stylesheet" type="text/css" />
<META NAME="ROBOTS" CONTENT="ALL">
<link rel="Shortcut Icon" href="/maxwhofaviconM.ico">

Thanks for all of your help!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 7 2007, 01:36 PM
Post #11


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Among the HTML errors reported by the online validator are some fairly significant structural problems with your layout tables.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 7 2007, 01:49 PM
Post #12


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



I do need to redo the html on this index page. I took over the website a little while ago and never went through to check the html.

But I still don't understand how these html errors are making my links in my gray nav go all the way to the left. And only in firefox. Everything is looking fine in Explorer, I just want my links to look like they do in explorer in firefox. It is going to take some time to fix the html and I was hoping for a quick fix for those silly links.

I appreciate all of your help, and showing me the validator errors. smile.gif Shows me what I really need to take some time to work on.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 7 2007, 02:01 PM
Post #13


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



QUOTE(Kifebear @ Mar 7 2007, 10:49 AM) *
But I still don't understand how these html errors are making my links in my gray nav go all the way to the left. And only in firefox. Everything is looking fine in Explorer, I just want my links to look like they do in explorer in firefox.
The structure of your layout tables is broken. Different browsers will recover from this markup error in different ways. You can turn on borders to see what's going on in your layout tables in different browsers, but until you fix the structure, different browsers are still going to render your document differently.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Kifebear
post Mar 7 2007, 02:37 PM
Post #14


Member
***

Group: Members
Posts: 38
Joined: 29-September 06
Member No.: 284



ooooh, thats a bummer. So I need to just go through and redo this html. I don't know how the last person working on this website managed to get things the way they are so I have some time to take. Thank you for your help. Do you know a good resource for learning to build a website using CSS? I have heard that that is the best way to construct a website. I am thinking if this site is such a mess, then I should just start it over and start it off the right way.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Mar 8 2007, 03:36 AM
Post #15


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



Lots of usefull CSS articles, references, tutorials and examples at http://www.d.umn.edu/itss/support/Training...design/css.html.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 8 2007, 10:16 AM
Post #16


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Please see the FAQ entry Where can I learn about CSS?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th April 2024 - 12:45 AM