|
|
|
| |||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
|
#1
|
||||
|
||||
|
how to position background image??
hey, i have this code below at the top of my page...the image that is there a a background image i would like to more to the right a bit so that some of the orange background is shown on the left!! can anyone advise how i do this please?? thanks
Code:
#TitleBar {
margin:0px 0px 10px 0px;
padding:28px 0px 5px 10px;
padding-left:10px;
/* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
height:33px; /* 14px + 17px + 2px = 33px */
border-style:solid;
border-color: #ffffff;
border-bottom: 1px #ff9900 solid;
border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
line-height:11px;
background-color:#ff9900;
background-image:url(../images/webmedia72.gif);
background-position: left;
background-repeat: no-repeat;
/* This is a fix for IE% */
voice-family: "\"}\"";
voice-family:inherit;
height:14px; /* the correct height */
}
/* "be nice to Opera 5" */
body>#TitleBar {height:14px;}
thanks RF
__________________
|
|
#2
|
||||
|
||||
|
try
Code:
background-position: left; in the #Titlebar section, if that isn't suitable you could read over this document from w3c... http://www.w3.org/TR/REC-CSS2/color...ground-position That explains the use of the background-position property.
__________________
The Standards! CSS 2 - CSS 3 - w3c CSS Validator - XHTML 1.1 - HTML 4.01 - w3c (X)HTML Validator - ActionScript Reference Links! Bert's Door and Lock Service | Brandon Erik Bertelsen | TextPattern |
|
#3
|
||||
|
||||
|
thanks for that i have managed to do background-position: 2% 2%; and that seems to work !! but i can't make it go down a bit ... which is strange, i thought it would be using the same settings.. and ideas??
cheers RF |
|
#4
|
||||
|
||||
|
Code:
background-position: [percentage | length] {1,2} |
[top | center | bottom] || [left | center | right]
cheers, gary
__________________
There are those who manage to build a web site without knowing what they're doing; thereby proving to themselves they do, indeed, know what they're doing. My html and css workshop, demos and tutorials. Ask a better question, get a better answer. |
|
#5
|
||||
|
||||
|
thanks for that i put in 2px and it moved nicely, well kinda!! it looks great in IE (which is a first
) but in firefox it now looks as if it is sitting on the bottom of the orange bar that goes along the top so i guess the orange bar is bigger in IE for some reason...arrrrr any ideas?Cheers RF |
|
#6
|
||||
|
||||
|
not to worry, i have managed to fix it by changing the height and it seems to have stayed good in IE, wierd!! but still....one final question which may require a new post but i will ask here anyway...is there a way i can make it so if i click on that image it takes me to the home page?? i can do it in normal html but am new to CSS and it is not something i have ever had to do or read about before and i can't seem to find anything useful on the web!
thanks in advanced RF |
|
#7
|
||||
|
||||
|
HI, you cant make a bg image into a link. You could place a div with a bg image, and use js 'onlclick' to make the entire div act like a link...
any good? |
|
#8
|
||||
|
||||
|
Quote:
hmmmmm, would rather not...thats a bummer...ok well i will have to forget that idea then!! thanks for replying!! RF |
![]() |
| Viewing: Dev Shed Forums > Web Design > CSS Help > how to position background image?? |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|