Member Avatar for momonq1990 
Code blocks are created by indenting at least 4 spaces
... and can span multiple lines

==============mycode================================

<style type="text/css">
body {
background-image:url(modern1.jpg);
background-attachment:fixed;
background-position:center center;
background-repeat:no-repeat
}
</style>
</head>

<body>
fasdfasd
</body>

pls help. all i want is fixe background even to scroll or anything
like this page.. http://www.teletech.com/
how to code the background????

  • 2 Contributors
  • 2 Replies
  • 121 Views
  • 7 Hours Discussion Span
  • Latest Post Latest Post by MarPlo

Dani AI

Generated

A quick, practical follow-up to the thread: had a working desktop solution (as observed), but fixed-page backgrounds can behave differently across devices and setups. If the image does not appear or does not stay fixed, first check the image path and the browser network panel for a 404. Also note that some mobile browsers ignore CSS background-attachment: fixed; a more robust pattern is to place a fixed, full-viewport image element behind the page content so it behaves consistently.

A simple, cross-device approach using an image element and CSS:

<img src="modern1.jpg" alt="" class="bg-img">

.bg-img {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
}
@media (max-width: 640px) {
  .bg-img { display: none; } /* optional: disable on small screens */
}

Troubleshooting and tips:

  • Verify the file path exactly (relative vs absolute) and confirm the image returns 200 OK in devtools.
  • Optimize the image (dimensions and file size) to avoid slow loading and janky scrolling on mobile.
  • If page elements use transforms or create new stacking contexts, the fixed element may not behave as expected; place the background element as a direct child of body and ensure content layers have higher z-index.
  • If you prefer CSS backgrounds, use background-size: cover for full-viewport fill; but keep the mobile limitation in mind.

For compatibility notes and more options, see the MDN references for background behavior and the object-fit alternative: background-attachment — MDN background-size — MDN object-fit — MDN.

Recommended Answers

All 2 Replies

Member Avatar for momonq1990

plss help to my project :( newbie here

Member Avatar for MarPlo

Hi,

I tested your code, and it works. The background image remains fixed in the center of the page, evean when scroll.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.