BleepingComputer.com: Problem centering background image

Jump to content


Register a free account to unlock additional features at BleepingComputer.com
Welcome to BleepingComputer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.

Click here to Register a free account now! or read our Welcome Guide to learn how to use this site.

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Problem centering background image

#1 User is offline   Daghead 

  • Member
  • PipPip
  • Find Topics
  • Group: Members
  • Posts: 27
  • Joined: 24-April 09

Posted 31 January 2010 - 05:43 PM

I want to stick a small image in the horizontal and vertical center of a page to serve in my home tab. I'm totally new at this and am not even sure whether I implemented this recommended CSS correctly. This is what the page's source code gets me in Firefox, even though it works perfectly when I switch to IE. Compiled in Programmer's notepad.

<html>
<head>
<title>Homepage</title>
  <link rel="icon" 
    type="image/png" 
    href="file:///C:/Users.....Home.png">
<style type="text/css">
body {
  background: url("file:///C:/Users.....Firefox.png") 50% 50% no-repeat;
}
</style>
</head>
<body>
</body>
</html>

Thanks for any help!
Dave

#2 User is offline   groovicus 

  • Hail Groovicus!
  • PipPipPipPipPipPip
  • Find Topics
  • Group: Moderator
  • Posts: 9,522
  • Joined: 05-June 04
  • Gender:Male
  • Location:Centerville, SD

Posted 31 January 2010 - 07:49 PM

In general, in order to center an element, the CSS way to do it is:
style="alignment-left:auto; alignment-right:auto:"

"Take the risk of thinking for yourself, much more happiness, truth, beauty, and wisdom will come to you that way" - Christopher Hitchens

#3 User is offline   Daghead 

  • Member
  • PipPip
  • Find Topics
  • Group: Members
  • Posts: 27
  • Joined: 24-April 09

Posted 31 January 2010 - 08:03 PM

Yeah see, I don't even know for sure where to put that, how to associate that with the image...

#4 User is offline   groovicus 

  • Hail Groovicus!
  • PipPipPipPipPipPip
  • Find Topics
  • Group: Moderator
  • Posts: 9,522
  • Joined: 05-June 04
  • Gender:Male
  • Location:Centerville, SD

Posted 31 January 2010 - 08:28 PM

Do you have an image tag that displays the background image?
"Take the risk of thinking for yourself, much more happiness, truth, beauty, and wisdom will come to you that way" - Christopher Hitchens

#5 User is offline   Daghead 

  • Member
  • PipPip
  • Find Topics
  • Group: Members
  • Posts: 27
  • Joined: 24-April 09

Posted 31 January 2010 - 09:02 PM

I don't even know what that means. I guess I should be ashamed for not doing due research, and in the end expecting someone else to do the work for me, sorry.

#6 User is offline   Romeo29 

  • Learning To Bleep
  • PipPipPipPipPipPip
  • Find Topics
  • Group: BC Advisor
  • Posts: 2,814
  • Joined: 06-July 08
  • Gender:Not Telling
  • Location:127.0.0.1

Posted 02 February 2010 - 10:31 PM 

"file:///C:/Users.....Firefox.png"
This path may work when viewing web page on your own computer but wont work if you upload it to a web server. So better get in the habit of using relative paths.

Something like this should work between <head> and </head> :
<style>
	   body{background:url('Firefox.png') no-repeat fixed center;}
</style>

[url="http://www.avast.com/"]avast! free antivirus[/url]

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users