Help!!!!

Anissa · #1 (**permalink**) 11-06-2008, 01:43 PM

I am trying to get a hang of the CSS code. I am finally evolving from html.

The problems are the following:

all the changes that I do show on Mozilla, Opera and Safari, but not on IE. GRRRRRRRR

Also. I am trying to get two graphics to be at the very top of the page and next to each other. I got the next to each other, but I can't get them to play nice and both be at the top.

This is frustratiing.

If you need to see my site, it's in my sig.

~ Anissa

**wige** · #2 (**permalink**) 11-06-2008, 01:53 PM

As far as getting changes to show up in Explorer, try hitting the refresh button twice. I believe that in some versions the first time the document is refreshed, IE only reloads the page itself, and on the second refresh it grabs the external files (images, js files and css files).

I went to your site, but I get a Page Can Not be displayed message.

Anissa · #3 (**permalink**) 11-06-2008, 01:58 PM

try it again, please, wige. I had to update my sig.

Sorry.

www.geocities.com/rayasroost/index.htm

**wige** · #4 (**permalink**) 11-06-2008, 02:35 PM

Ah, ok. I can get to the page now, but I am not exactly sure why the elements are not lining up...

google junky · #5 (**permalink**) 11-06-2008, 03:02 PM

1. There are 2 closing </head> tags to start off with
2. You have named some tags <p1><p2><div2><div3>. There are no such tags by this name(just name them <p> and <div>
3. Any code before <html> and after </html> needs to be removed

Start There and then I'll look again after that Is fixed.

**dharrison** · #6 (**permalink**) 11-06-2008, 03:21 PM

Looking at your stylesheet, you need to take the link out of:

Quote:

a:visited link:

Instead of p1, p2 (which don't exist). Instead I suggest using the following on the stylesheet:

Quote:

p.one { attributes; }

Quote:

and div1 and div2 stylesheet:

Quote:

#div1 { attributes; }

Quote:

<div id="div1">Content etc</div>

Hope this helps.

Anissa · #7 (**permalink**) 11-08-2008, 09:44 AM

I have tons of websites bookmarked to help me, but none of them told me that there was no p1 or higher. I am even more lost than I thought I was. :\

How are you supposed to tell the code that you have more than one place for things on a page if there is no p2 or place pictures on the page?

This dinosaur is confused. lol

google junky · #8 (**permalink**) 11-08-2008, 12:34 PM

Quote:

Originally Posted by Anissa

How are you supposed to tell the code that you have more than one place for things on a page if there is no p2 or place pictures on the page?

Currently:

Code:

<p1><IMG src="http://www.geocities.com/rayasroost/pics/sitebanner.gif"></p1>
<p2><IMG src="http://www.geocities.com/rayasroost/pics/banner.gif"></p2>

Should be:

Code:

<p><IMG src="http://www.geocities.com/rayasroost/pics/sitebanner.gif"></p>
<p><IMG src="http://www.geocities.com/rayasroost/pics/banner.gif"></p>

The same for the <div> tags. Take the number out of them.

I looked at the source again since the last time and I haven’t seen anything changed at all. Do you have a test page you are working on and not making live in the web?

Anissa · #9 (**permalink**) 11-08-2008, 01:05 PM

between being sick and having to work, I haven't had time to make changes.

I have printed up the suggestions and I am going to implement them.

It's hard to concentrate when you're running a fever that brings a headache along for the ride.

google junky · #10 (**permalink**) 11-08-2008, 01:15 PM

I hope you get feeling better. I'll keep an eye out if you add anything else here.

Anissa · #11 (**permalink**) 11-08-2008, 01:17 PM

Quote:

Originally Posted by google junky

1. There are 2 closing </head> tags to start off with

I had two opening ones two. I got rid of one set.

Quote:

Originally Posted by google junky

2. You have named some tags <p1><p2><div2><div3>. There are no such tags by this name(just name them <p> and <div>

okay. Done.

Quote:

Originally Posted by google junky

3. Any code before <html> and after </html> needs to be removed

I did it on the index page. I am not worrying about the other pages until I have this one right.

~Anissa

google junky · #12 (**permalink**) 11-08-2008, 03:20 PM

Take all the code out before <html> and all the code after </html>.

also remove the following:

Code:

<!-- following code added by server. PLEASE REMOVE -->
<link href="http://us.geocities.com/js_source/div.css" rel="stylesheet" type="text/css"><script language="JavaScript" src="http://us.geocities.com/js_source/div03.js"></script>
<!-- preceding code added by server. PLEASE REMOVE -->

In the meta tags it is:
currently "<meta name="rayasroost"
Should be <meta name="description"

Note: Remember to always keep a backup of your work.

Anissa · #13 (**permalink**) 11-08-2008, 05:31 PM

Quote:

Originally Posted by google junky

also remove the following:

Code:

<!-- following code added by server. PLEASE REMOVE -->
<link href="http://us.geocities.com/js_source/div.css" rel="stylesheet" type="text/css"><script language="JavaScript" src="http://us.geocities.com/js_source/div03.js"></script>
<!-- preceding code added by server. PLEASE REMOVE -->

This stuff doesn't show up in the code that I am typing. I think geocities is doing that when the page is live. I don't know how to get it off. I checked all my pages and there is nothing like that in the code that I typed.

Quote:

Originally Posted by google junky

In the meta tags it is:
currently "<meta name="rayasroost"
Should be <meta name="description"

fixed

Quote:

Originally Posted by google junky

Note: Remember to always keep a backup of your work.

yep.

Anissa · #14 (**permalink**) 11-10-2008, 10:49 AM

Okay.

I got the graphic and the text at the top of the page where I want it.

Now I am repositioning the text boxes back to where I need them to be. I have to use absolute positioning. Every time I use relative positioning, everything goes wonky.

Here is the new problem:

I have to move the box with the main text up slightly in Mozilla, Opera, and Safari, but down in IE. WTF? How do I do that? I am really beginning to wonder why people use IE at all. sheesh. Before I even add any graphics on the main page, I have get this working.

(

google junky · #15 (**permalink**) 11-10-2008, 11:01 AM

Honestly I am not a pro at CSS.
I could do exactly the same layout you are trying to make with tables instead of divs in about 2 seconds(or about that

)

IE is such a pain the butt to make work with CSS. I do applaud you for working so hard on it though.
I did see one person post that they use to different css files. one for IE only and one for all the other browsers.
An IF statement was used.

Here is a place where it is explained.
CSS - Conditional comments

like this:

Code:

<link href="all_browsers.css" rel="stylesheet" type="text/css">
<!--[if IE]> <link href="ie_only.css" rel="stylesheet" type="text/css"> <![endif]-->

Anissa · #16 (**permalink**) 11-10-2008, 11:07 AM

Thanks for your help this far.

I appreciate it.

google junky · #17 (**permalink**) 11-10-2008, 11:12 AM

I added a snippet of the code you would use in my last post. we posted about the same time I think.

Good luck,
Google Junky

Anissa · #18 (**permalink**) 11-10-2008, 11:14 AM

I hope this does the trick. Thanks so much.

google junky · #19 (**permalink**) 11-10-2008, 11:24 AM

This was a good read as well.
CSS Hacks- The good, the bad, and the ugly- Conditional comments

Your welcome

google junky · #20 (**permalink**) 11-10-2008, 11:41 AM

two things I looked at that might be a problem.

Look for these in your stylesheet.css file

Curently:

Code:

a:visited link: {color: #400040;}

Change to:

Code:

a:visited {color: #400040;}

Currently: (i think you were just missing the semi-colon)

Code:

/* List bullet code */
ul
{list-style-image: url("http://www.geocities.com/rayasroost/pics/rbullet.gif")}
/* End of list code */

Change to this:

Code:

/* List bullet code */
ul {
list-style-image: url("http://www.geocities.com/rayasroost/pics/rbullet.gif");
}
/* End of list code */

Anissa · #21 (**permalink**) 11-10-2008, 11:58 AM

That condition thing really worked like a charm. ty everso much for your help, Junky!

Anissa · #22 (**permalink**) 11-10-2008, 12:59 PM

Do you think there is one for Safari as well?

It is only off slightly in Safari, but enough to notice that it is off.

I tried the same "if" thing for safari, but got nothing. I know this will probably mean a third code page, but if it gets rid of cross-browser glitches, I am willing to put up with editing three stylesheets.

ANYONE???

google junky · #23 (**permalink**) 11-10-2008, 06:55 PM

Anissa,

I hope you didn't mind, but I rewrote your homepage and two CSS files. I sent them to the email address you had on your site in a zip file.

Edit: Actually I sent a second zip file. use that one instead and just delete the first one I sent.

You will have to format the text color, size, and maybe some alignment as to how you wanted it.
Otherwise it should be the way you wanted I think.

The page works on 800x600 and larger screen resolutions.
The HTML and CSS both validate 100% when checked at W3C

Google Junky

Dev4u · #24 (**permalink**) 11-11-2008, 05:34 PM

Hi Anissa, all ..

Thought this may help you or anyone trying to wade through CSS.

Normally when I develop, I put all hacks inline (page you are developing) and into a stylesheet between the HEAD tags. This validates, and hacks won't validate in an external stylesheet.

If using an external stylesheet, make a new class/div inline that is unique to any other style used so as not to have any duplicate internal/external styles. IE6 can be specifically targeted by using an underscore "_" before your style ie.. "_margin:10px 0 0 0;" .. for IE7, use "*" in same fashion .. and for Safari insert this style and edit:

@media screen and (-webkit-min-device-pixel-ratio:0) {
#someclass { margin:10px 0 0 0; }
}

In addition, any style rules that are going to be reused should be made into classes, as repeated div styles do not validate.

If you want your pages to be scalable and grow with any ammount of content, you should use relative positioning. This is a good practice to get into anyway. You can get away with using absolute positioning inside of a relative positioned element, but watch for page breaks cross browser just in case.

If you have any more queries re: CSS, please fire away and I hope that I've cleared some things up for you.


Register	FAQ	Calendar	Mark Forums Read

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode