...

View Full Version : Who's got css skills? I need an expert



turningpoint
06-29-2010, 09:50 AM
For the life of me, I cannot figure out what css file or value is affecting some text. It only shows up in IE, but it looks horrible.

In IE only, the words "Website Package" and "Payments" show up in black. I have used firebug to try and determine what the source is, but to no avail.

I can tell you that it is not line 20 or 36 in template.css because changing the #000000 to #ffffff does nothing.

If anyone with css skills can figure this out, I will be very grateful.

Zechariah

http://www.turningpointweb.com/index.php/component/osemsc/register?layout=onestep

bennyy007
06-29-2010, 10:09 AM
I might be wrong but I just looked through your source and saw it's wrapped between <legend></legend> so therefore in your CSS file "template.css" add the following:



legend {
color:#fff;
}


It may or may not work... but it's worth a try :)

effpeetee
06-29-2010, 12:50 PM
According to W3 validators, you have 70 html errors (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.turningpointweb.com%2Findex.php%2Fcomponent%2Fosemsc%2Fregister%3Flayout% 3Donestep&charset=%28detect+automatically%29&doctype=Inline&group=0) and 70 css errors. (http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.turningpointweb.com%2Findex.php%2Fcomponent%2Fosemsc%2Fregister%3Flay out%3Donestep&profile=css21&usermedium=all&warning=1&lang=en)

You should put these right.

Frank

bennyy007
06-29-2010, 01:02 PM
:eek:

turningpoint
06-29-2010, 06:33 PM
I might be wrong but I just looked through your source and saw it's wrapped between <legend></legend> so therefore in your CSS file "template.css" add the following:



legend {
color:#fff;
}


It may or may not work... but it's worth a try :)

That did the trick! I saw that <legend> seemed to be an area of interest in firebug but I had no idea how to solve the issue. THANK YOU.

Yeah those errors are from the developers of the extensions and template I am using. It looks like they weren't too interesteed in being W3 valid...

I will address those errors in the future.

Thank you benny007:thumbsup:

bennyy007
06-29-2010, 11:30 PM
No worries glad it helped ;)

michelbell
06-30-2010, 09:10 AM
I need to make a little line 2px high and about 15 px long. How can I do this in html / css?

Seo Services India (http://www.seobaba.com/seo-services-india/seo-services-india.html)

effpeetee
06-30-2010, 10:06 AM
One way is to use a div 15px by 2px and fill with the colour that you need. Move the div in the normal way.
You can also use a div and just put a border on one side.

Frank

Donkey
06-30-2010, 01:34 PM
You should use the <hr> tag.
In your CSS:

hr{
width:15px;
height: 2px;
background-color: #000;
color: #000;
}
(you need to give it color and background color or it won't work in IE6. Change the colour to whatever you want)

Then in your html

<hr>
Or if using xhtml

<hr />

turningpoint
07-01-2010, 01:51 AM
Thank you so much for the previous answer.

On another CSS note, I need to add a square border around the top portion of form fields on this page: http://www.turningpointweb.com/index.php/registration-and-payment

I have given it my best, but all I can successfully create is a border that stretches the entire width of the page, which that obviously looks terrible.

The image best shows what I am trying to do. The padding on the right of the form fields are for a "required" prompt. I have heard that its possible to do rounded corners with pure css, but if its too complicated, just a basic square border will do.

I am aware of all the page errors the extension and template providers gave me to fix :(

Any help to steer me in the right direction is much appreciated.

http://www.turningpointweb.com/border1.jpg

Sincerely,
Zechariah

bennyy007
07-02-2010, 07:37 AM
For making a border only stay around the the content and not flow to the entire page width is use this simple method...



div.login
{
border:1px #fff solid;
width:400px;
overflow:hidden;
padding:left:3px;
padding-right:10px;
padding-bottom:8px;
padding-top:5px;
}


Now all you need to do is mess about with padding-right,padding-left,padding-bottom,padding-top and width to get it perfect to your liking of course.

Good luck :D

turningpoint
07-13-2010, 12:59 AM
Thanks again benny :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum