Is there any way to remove the border on a page? So that an image can rest at (1,1) on the browser screen? My page's logo needs to sit there so that the colours flow well. Any help?

Dani AI

Generated

Short note: was right — the browser adds default page spacing, which is why an image never sits flush at the very corner by default. For a logo that must sit exactly at (1,1) there are two reliable approaches: pin the image to the viewport, or normalize/reset the page baseline and let the image live in flow.

A viewport-pin approach keeps the image independent of document margins and is the simplest when you want a fixed corner logo:

img.logo {
  display: block;
  border: 0;
  position: fixed;
  top: 1px;
  left: 1px;
  z-index: 1000;
}

If the logo should scroll with the page instead, use position: absolute inside a positioned container (not the body) and ensure the container has no offset. For global fixes that affect the whole page, make sure the document is in standards mode (use a modern DOCTYPE) and apply a small reset or include a normalization stylesheet so browsers start from the same baseline:

<!DOCTYPE html>

Extra tips: if the logo is wrapped in a link, remove the link’s image border for older browsers. Watch mobile notches — use the safe-area insets if you need to respect device cutouts. Finally, test in multiple browsers and viewports (desktop, tablet, phone) so the corner alignment behaves the same everywhere. Glad it worked for — these checks keep that behavior consistent across environments.

Recommended Answers

All 2 Replies

Use CSS to eliminate any margin and padding of the body tag:

body { margin: 0; padding: 0; }
commented: Thanks for the CSS help! +1

Hey, thanks a lot!

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.