Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Icon on CSS page

Status
Not open for further replies.

cluM09

Technical User
May 15, 2004
127
US
Hello,

I am new to HTML page design. I need help with how to place the icon on the CSS page.

I have a css page that I need to have the icon displayed at the top left corner of the page.

How can I add the icon to the top left corner of the page like the HTA page wher I just have icon="icon.ico" to display the icon?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>List Group Membership</title>
<style type="text/css">
/* Default CSS Stylesheet for a new Web Application project */
body{background-color:#cdd4e6; margin:20 20 20 0; color:#444444;}
td{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
select{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
input{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
a{font-family:Arial, Helvetica, sans-serif; font-size:11px;color:#444444;}

/* Custom */
td.header{background-color:#7f92bf; color:#ffffff; font-size: 20px; padding-left:15px;}
td.content{padding:15 15 15 15; background-color:#ffffff;}
td.title{color:#7f92bf; font-size:10px;}
td.error{color: #ff0000}

/* Tabs */
a.tablink{font-weight:bold;text-decoration:none;}
.tabline{border-bottom:1px solid #CCCCCC}
.tab{border-top:1px solid #CCCCCC;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;padding:3 5 3 5;border-left:1px solid #CCCCCC;background-color:#eeeeee}
.tabactive{border-top:1px solid #CCCCCC;border-right:1px solid #CCCCCC; border-left:1px solid #CCCCCC;padding:3 5 3 5;}

/* Grid */
td.gridheader{padding:3 3 3 3; font-weight:bold; background-color:#eeeeee;}
td.gridcell{padding:3 3 3 3;border-bottom:1px solid #eeeeee}
</style>

I want to have the icon displayed at the SYSMENU like that of the HTA page. I want to have the equivalence of the HTA icon as the code listed below.

<HTA:APPLICATION
BORDER = "thick"
ID="HTAUI"
APPLICATIONNAME="My HTA Application"
MAXIMIZEBUTTON="no"
MINIMIZEBUTTON="no"
SCROLL="no"
SINGLEINSTANCE="yes"
WINDOWSTATE="maximized"
SYSMENU="yes"
ICON="icon.ico"
>

Thanks.
 
CSS cannot show any icons anywhere and HTML can only show icon in the address line of the browser. Any other icon would simply be an appropriate picture placed at an appropriate place on the page. Since we know nothing about your page structure or even which of the two icons you would want, it is nearly impossible for us to give you a smart advice.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
If you do mean the one in the URL bar, search on Google for "favicon".

If you mean the icon in the very top-left of the browser's title bar, then you cannot change this.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Vragabond,

I have the code from the HTA listed below. Just copy the code to a text editor, name the extension of the file with .hta, and launch the script. You will see that on the top left corner of the page, there is a square block instead of the icon picture of the web browser.

If you have an icon file called icon.ico in the same folder of this script, you will see the icon on the top left corner of the page instead of the blank square block. The CSS code I posted above can also run as an HTA.

<html>
<head>
<title>Running a Script from Text</title>

<HTA:APPLICATION
ID="objScriptFromText"
APPLICATIONNAME="Running a Script from Text"
MAXIMIZEBUTTON="no"
MINIMIZEBUTTON="no"
SCROLL="auto"
SINGLEINSTANCE="yes"
ICON = "ICON.ICO"
>

</head>

<SCRIPT Language="VBScript">

Sub RunScript
Msgbox "The script has run."
End Sub

</SCRIPT>

<body bgcolor="buttonface">

<span id="ClickableSpan" onClick="RunScript" >
Click here to run the script</span>

</body>
</html>

I want to have the equivalence of the HTA icon where ICON="ICON.ICO"

Is it possible to have the icon displayed on the CSS page like that of the HTA?

Thanks.

 
Works fine for me. Are you sure that your icon.ico file is in the same directory as your .hta file?

___________________________________________________________
If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller
Steam Engine Prints
 
johnwm,

You miss-understood I wanted. I know that the hta code can display the icon, and it works fine. But the code below CANNOT display the icon:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>List Group Membership</title>
<style type="text/css">
/* Default CSS Stylesheet for a new Web Application project */
body{background-color:#cdd4e6; margin:20 20 20 0; color:#444444;}
td{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
select{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
input{font-family:Arial, Helvetica, sans-serif; font-size:11px;}
a{font-family:Arial, Helvetica, sans-serif; font-size:11px;color:#444444;}

/* Custom */
td.header{background-color:#7f92bf; color:#ffffff; font-size: 20px; padding-left:15px;}
td.content{padding:15 15 15 15; background-color:#ffffff;}
td.title{color:#7f92bf; font-size:10px;}
td.error{color: #ff0000}

/* Tabs */
a.tablink{font-weight:bold;text-decoration:none;}
.tabline{border-bottom:1px solid #CCCCCC}
.tab{border-top:1px solid #CCCCCC;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;padding:3 5 3 5;border-left:1px solid #CCCCCC;background-color:#eeeeee}
.tabactive{border-top:1px solid #CCCCCC;border-right:1px solid #CCCCCC; border-left:1px solid #CCCCCC;padding:3 5 3 5;}

What I wanted is to have the code above to display the icon like the HTA code I posted.

 
I might still be misunderstanding, but you want an icon like the HTA page has on a regular html page? You cannot do that, you can only have an icon in the address bar by using [google]favicon[/google].

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
At the risk of repeating myself:

My previous post said:
If you do mean the one in the URL bar, search on Google for "favicon".

If you mean the icon in the very top-left of the browser's title bar, then you cannot change this.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Say that again Dan :)

<honk>*:O)</honk>

Tyres: Mine's a pint of the black stuff.
Mike: You can't drink a pint of Bovril.
 
BillyRayPreachersSon,

Thank you the information.

Yes, what I mean is the icon at the very top-left of the browser's title bar, which is also called the sysmenu on the HTA page.

Since there is no way to have the icon on the very top left corner of page, I may need to re-write the CSS page to use HTLM of the HTA page instead since the HTA can allow me to have the icon.

Thanks again.

 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top