Problem with css

S

Shelly

I want to have two links on a single line. The css I have inherited (I am a
php person and not much on css) makes them come out on individual lines with
a long white bar under and in white font.
Whether or not I specify style="main" the problem occurs. If I delete the
css fle include, then it works correctly. Can anyone help this novice?

Sheldon

Here is my test code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
@import url("css/styles.css");
</style>
<title>Untitled Document</title>
</head>
<body>
<a href="mailto:[email protected]">without_1&nbsp;&nbsp;</a>
<a href="mailto:[email protected]">without_2</a>
<a href="mailto:[email protected]" style="main">main_1&nbsp;&nbsp;</a>
<a href="mailto:[email protected]" style="main">main_2</a>
</body>
</html>

Here is the css file:

body {
background:#11418b;
margin:0 auto;
padding:0;
font-family:"Trebucht MS", Verdana, Arial, Helvetica, sans-serif;
}
#wrapper {
position:absolute;
border:0;
margin:0 auto;
width:900px;
height:700px;
text-align:left;
background-color:#ab0801;
left: 12px;
top: 96px;
z-index: 5;
}

#header {
background-color: #ab0801;
background-image: url(../i/header_bg.jpg);
color: #fff;
position:absolute;
left:10px;
width: 900px;
}

#menu {
position:absolute;
left:5px;
width:160px;
height:auto;
z-index:1;
padding: 5px;
top: 5px;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}

#content {
position:absolute;
left:184px;
top:5px;
width:700px;
height:680px;
z-index:2;
background-color: #CCCCCC;
padding: 5px;
}

a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 14px;
font weight: bold;
border-bottom: thin #FFFFFF solid;
display: block;
padding-bottom: 3px;
text-decoration: none;
}

a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #CCCCCC;
font-size: 14px;
font weight: bold;
border-bottom: thin #FFFFFF solid;
display: block;
padding-bottom: 3px;
text-decoration: none;
}

a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 14px;
font weight: bold;
border-bottom: thin #FFFFFF solid;
display: block;
padding-bottom: 3px;
text-decoration: none;
}
a.main:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0000CC;
font-size: 16px;
font weight: bold;
text-decoration: none;
border-bottom: none;
width: 130px;
display: block;
padding-bottom: 3px;
}

a.main:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 16px;
font weight: bold;
width: 130px;
text-decoration: none;
border-bottom: none;
display: block;
padding-bottom: 3px;
}

a.main:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0000CC;
font-size: 16px;
font weight: bold;
width: 130px;
text-decoration: none;
border-bottom: none;
display: block;
padding-bottom: 3px;
}
 
R

Rob Waaijenberg

Shelly schreef:
I want to have two links on a single line. The css I have inherited (I am a
php person and not much on css) makes them come out on individual lines with
a long white bar under and in white font.
Whether or not I specify style="main" the problem occurs. If I delete the
css fle include, then it works correctly. Can anyone help this novice?

Sheldon
Click to expand...
[snipped code]

Can you provide a link to the page?

We're a little reluctant to copy/paste the code you gave.
 
J

John L.

Shelly said:
I want to have two links on a single line. The css I have inherited (I am a
php person and not much on css) makes them come out on individual lines with
a long white bar under and in white font.
Whether or not I specify style="main" the problem occurs. If I delete the
css fle include, then it works correctly. Can anyone help this novice?

Sheldon

Here is my test code:
Click to expand...

<snip>

It should be class="main", not style="main".

<a href="mailto:[email protected]" class="main">main_2</a>

The links appear on different lines because of the 'display: block;'
declarations in the CSS. Try changing your stylesheet so the a rules
look like this:

a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 14px;
font weight: bold;
text-decoration: none;
}

a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #CCCCCC;
font-size: 14px;
font weight: bold;
text-decoration: none;
}

a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size: 14px;
font weight: bold;
text-decoration: none;
}
a.main:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0000CC;
font-size: 16px;
font weight: bold;
text-decoration: none;
}

a.main:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 16px;
font weight: bold;
text-decoration: none;
}

a.main:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #0000CC;
font-size: 16px;
font weight: bold;
text-decoration: none;
}
 
J

Jonathan N. Little

Shelly said:
Thank you very much. That did the trick!
Click to expand...

But Shelly forget the CSS, if you are a PHP coder what the hell are you
doing with "mailto" in links?

<your code>
<a href="mailto:[email protected]">without_1&nbsp;&nbsp;</a>
<a href="mailto:[email protected]">without_2</a>
<a href="mailto:[email protected]" style="main">main_1&nbsp;&nbsp;</a>
<a href="mailto:[email protected]" style="main">main_2</a>
</your code>

Tisk-tisk! And what happens to the webmail only folks? Should be at least:

<a href="processing.php?do=without1">without_1&nbsp;&nbsp;</a>
<a href="processing.php?do=without2>without_2</a>
<a href="processing.php?do=main1" style="main">main_1&nbsp;&nbsp;</a>
<a href="processing.php?do=main2" style="main">main_2</a
 
S

Shelly

Jonathan N. Little said:
But Shelly forget the CSS, if you are a PHP coder what the hell are you
doing with "mailto" in links?
Click to expand...

If I want to sent a packaged email from the web, or even have the
composition of the text, etc. done in the web app, then I do just as you say
(and have done so before many times). However, this is for a small company
for internal use, and part of the app is to send email to clients not using
this app. I want the app to bring up the sender's own email client and have
the address be in there automatically. They will then write whatever they
want as text for the email. "mailto" does this perfectly, as the users all
have email clients.

Did I misinterpret what you are saying?

Sheldon
 
J

Jonathan N. Little

Shelly said:
If I want to sent a packaged email from the web, or even have the
composition of the text, etc. done in the web app, then I do just as you say
(and have done so before many times). However, this is for a small company
for internal use, and part of the app is to send email to clients not using
this app. I want the app to bring up the sender's own email client and have
the address be in there automatically. They will then write whatever they
want as text for the email. "mailto" does this perfectly, as the users all
have email clients.

Did I misinterpret what you are saying?
Click to expand...

Not sure if I understand what you are saying. The persons clicking these
links *only* employees of this company? Or people *outside* of this
company? I.e., it this private on an intranet, or public on the Internet?
 
S

Shelly

Jonathan N. Little said:
Not sure if I understand what you are saying. The persons clicking these
links *only* employees of this company? Or people *outside* of this
company? I.e., it this private on an intranet, or public on the Internet?
Click to expand...

The only people using this will be employees of the company. It is not for
public consumption. It will actually be on the internet, so that they can
work from home, etc., but it will be password protected so that only company
employees can log in. Even mobile, they will have email clients on their
laptops or home computers. I don't have to worry about the general public
needing to send an email this way.

Shelly
 
A

Alfred

Shelly schreef:
I want to have two links on a single line. The css I have inherited (I am a
php person and not much on css) makes them come out on individual lines with
a long white bar under and in white font.
Whether or not I specify style="main" the problem occurs. If I delete the
css fle include, then it works correctly. Can anyone help this novice?

Sheldon
Click to expand...
[snipped code]

Can you provide a link to the page?

We're a little reluctant to copy/paste the code you gave.
Click to expand...

Why ? Can it be malignant ?
 
B

Bergamot

Alfred said:
Why ? Can it be malignant ?
Click to expand...

You must be new around here.

"Malignant" isn't the issue, and "reluctant" was probably being nice.

It's a PITA for us to copy/paste code and make our own web page to help
with some "problem". If you expect assistance, make it as easy as
possible for us to help you. Posting code is not the way. Posting a URL
is. It's as simple as that.

Whether you agree or not is irrelevant - it's the accepted practice of
this group and most others related to web authoring. BTW, not having a
publicly available server is no excuse. There are plenty of places to
post a test page for free if you need to.

BTW, you should have considered lurking here for a while or reading the
group archives before posting. Then you'd have found this answer
yourself. Now that you've spoken up, we see you have done neither of
those things, which makes you sound either clueless or troll-like,
neither of which is in your favor. This behavior is characteristic of
google gropers. If you want any respect around here, don't be like them.
 
R

Rob Waaijenberg

Alfred schreef:
Shelly schreef:
I want to have two links on a single line. The css I have inherited (I am a
php person and not much on css) makes them come out on individual lines with
a long white bar under and in white font.
Whether or not I specify style="main" the problem occurs. If I delete the
css fle include, then it works correctly. Can anyone help this novice?

Sheldon
Click to expand...
[snipped code]

Can you provide a link to the page?

We're a little reluctant to copy/paste the code you gave.
Click to expand...

Why ? Can it be malignant ?
Click to expand...

Who knows???

If you provide a link to a real webpage we can assess the code 'in the
wild' so to speak. We get to see all the parts that matter, and no
chance that anything gets accidently deleted or mistyped.

I realize that you would not let that happen,
but then again...
 
J

Jonathan N. Little

Alfred said:
On Fri, 12 Oct 2007 14:21:04 +0200, Rob Waaijenberg


Why ? Can it be malignant ?
Click to expand...

No because it would be rather pointless because he does not have related
resources:

@import url("css/styles.css");
and
background-image: url(../i/header_bg.jpg);

on his local system that may have something to do with the problem. That
is why you see posted here so often, "Don't post code, post a URL"
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Interfering CSS 1
Image on header 2
Positioning CSS components 1
How do I fix this issue in sqaurespace code block? 1
How to position the *tooltip* comment on these buttons? 9
Working on mobile css menu with plenty of frustration! 2
Help with my responsive home page 2
SendGrid email issue in responsive Gmail 1

Members online

No members online now.
Total: 40 (members: 0, guests: 40)
Robots: 306

Forum statistics

Threads
473,995
Messages
2,570,236
Members
46,822
Latest member
israfaceZa

Latest Threads

Top