otuatail Posted May 3, 2008 Share Posted May 3, 2008 I was hoping to place the website image in a style sheet rarther than each individual page. The CSS an core html is this. *** Html *** <html> <head> <link rel="stylesheet" href="stylesheets/lowther.css" type="text/css"> </head> <body> <form> <div id="logo"> <div> </form> </body> </html> *** CSS *** .logo { position:absolute; left:0px;top:0px; background-image: url(../images/screen2.jpg); } Any help on this basic idea Desmond. Quote Link to comment Share on other sites More sharing options...
dbrimlow Posted May 3, 2008 Share Posted May 3, 2008 What is it you are asking? Your basic concept about the image command is right. It all depends on the image - designate height and width of the container at a minimum of the size of the image. If the image is 40 x 80 pixels, than that is the minimum height and width for the container. Most common way to set a "logo" is to contain it within a header: #header { float:left; margin:1em .5em; padding:.5em; width:100%; } /* always self-clear parent container floats with the :after pseudo element */ #header:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* add the logo */ #logo { float:left: margin:.5em 1em; padding:0; height:40px; width:80px; background:#fff url (../images/screen2.jpg) no-repeat 0 50%; } Change the background color to whatever the container background is (if other than parent or body), then add the url and image path, then repeat or no-repeat, then 0 50% (meaning to the left and middle of any elements to its right such as text h1 */ <html> <head> <link rel="stylesheet" href="stylesheets/lowther.css" type="text/css"> </head> <body> <div id="header"> <div id="logo"><div> <h1>site name</h1> <div> </body> </html> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.