8 replies [Last post]
srinivas420
Offline
newbie
Last seen: 13 years 37 weeks ago
Timezone: GMT-4
Joined: 2007-06-07
Posts: 6
Points: 0

Hello
before answering these questions please see my home page, the page which i wish to apply the answer to these questions, www.manhattanpierre.com on any browser except mozilla firefox.
1. Can I vertically center the M with CSS?
2. Is there a way I can cycle home pages with different colors for the background and M?
3. How do you fix the mozilla firefox problem with reading html colors?
Thank You :jawdrop:

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 3 days 14 hours ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

There's no problem with Firefox

There's no problem with Firefox[1], it's doing exactly what you told it. Your use of bgcolor left off the # and black is the default text color anyway. The use of attributes for those purposes is deprecated in any strict DTD, which you should use. There is no sane reason to deprecated elements or attributes in a new document. Set the colors in the stylesheet.

body {
  background-color: #c90;
  color: black;
  }

That's all you want, a single character centered in the viewport? In that case, use a single celled table.

When you set the huge font size on span, it simply overflowed the default font size of a. That's why the :hover color only extended about 19px. You need to set the font size on a. There is no obvious reason for span.

So, let's look at what we have.
html, body, table {
min-height: 100%;
width: 100%;
height: 100%
}

body {
background-color: #c90;
color: black;
margin: 0;
padding: 0;
}

body#page1 {
background-color: #c90;
color: black;
}

body#page2 {
background-color: #9c0;
color: black;
}

body#page3 {
background-color: #c09;
color: black;
}

table {
position: absolute;
top: 0;
left: 0;
}

td {
height: 100%;
}

p {
font-size: 1em;
position: relative;
}

a {
font-size: 150px;
}

a:link {
color: #009900;
text-decoration: none;
}

a:visited {
color: #009900;
}

a:hover {
color: #000000;
text-decoration: underline;
background-color: #009900;
}
============





M






We could have done this with css, but due to IE's lack of support for css2, it's an ugly work-around to get IE to cooperate. If you insist, I'll show you; but, it's overkill for this.

Note the ids for body.

cheers,

gary

[1] If IE and Firefox give you different renderings, assume Firefox is right, even if the IE version is what you're shooting for. In that case, you've written a buggy bit of code. IE does not completely support html4, and supports less than half of css2.1. Firefox has nearly complete support of both.

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

srinivas420
Offline
newbie
Last seen: 13 years 37 weeks ago
Timezone: GMT-4
Joined: 2007-06-07
Posts: 6
Points: 0

vertical alignment

I guess ill just have to wait until IE fixes their support for CSS, and sun microsystems brings out CSS3 which will hopefully have vertical alignment. I am content with cycling pages with different colors.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 3 days 14 hours ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Don't hold your breath

As for IE becoming a good browser, don't hold your breath. You can center vertically on the viewport using css, but for this use case, it's an overly complex bit of code because of having to add a messy work-around for IE.

Sun has nothing to do with css3. Besides, css2 already provides for controlling vertical alignment; it's IE that doesn't comply.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

srinivas420
Offline
newbie
Last seen: 13 years 37 weeks ago
Timezone: GMT-4
Joined: 2007-06-07
Posts: 6
Points: 0

This is all I want

Hey gary all i want is the code below with the ability to cycle the three different schemes shown below with the code that is given. They should be choosed randomly when
one enters the link. I also may want to add more color schemes. Vetical alignment is not needed, as a solution will come soon.

W E L C O M E


a {
font-size: 150px;
}
#1

* {
background-color: #6f9;
}
a:link {
color: #009900;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
background: #009900;
}

#2
* {
background-color: #9ff;
}
a:link {
color: #cc9900;
text-decoration: none;
}
a:hover {
color: #cc9900;
text-decoration: underline;
background: #009900;
}

#3
* {
background-color: #060;
}
a:link {
color: #009900;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
background: #009900;
}








M

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 8 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Cycling through something

Cycling through something randomly is not a function that CSS can perform you need to script that sort of behaviour.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

srinivas420
Offline
newbie
Last seen: 13 years 37 weeks ago
Timezone: GMT-4
Joined: 2007-06-07
Posts: 6
Points: 0

There must be a way please tell me!

Also, how can I make it that when you hover over an image no matter what browser it is text will pop up giving information i would like to convey to the reader?

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 3 days 14 hours ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

The vertical alignment need

The vertical alignment need not wait, I gave you a solution.

The title attribute will trigger a tooltip with your text.a white house

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

srinivas420
Offline
newbie
Last seen: 13 years 37 weeks ago
Timezone: GMT-4
Joined: 2007-06-07
Posts: 6
Points: 0

One more thing

That last thing I need is some lead to how I can cycle home page styles, please give me some answer!