Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

eBay Store Design - Overall page width and background centring

Featured Replies

Hi everyone,

 

Welcome to my first call for help, I'm currently putting together an eBay store for the company I work for and have never done this before. I've put together the header so it looks like our original online store but have a few things I cant and would like to do.

 

1. I need the picture in the header to stay in the middle but also be 30px from the top of the screen(which I suppose I can do with a spacer) to line up with the menu bar.

 

2. How can I get the site width to be like this instead of mine which is currently like this

 

My CSS is here and the html can be found here

 

Any assistance would be great.

 

Thanks,

 

Grant

I've never done an ebay page so I'm not sure how much customization can be done and how - but the example you posted is in a div called #pagecontainer with a set width of 975px and margin: 0 auto. Try inspecting it in Firebug.

  • Author

I've never done an ebay page so I'm not sure how much customization can be done and how - but the example you posted is in a div called #pagecontainer with a set width of 975px and margin: 0 auto. Try inspecting it in Firebug.

 

Well the page we have seems to span the whole width of the screen and other seems to be at a fixed width, but I can't get my head around how to do it, even if I look at someone else's code!

 

The worst thing is this eBay store is my current project (kinda learning as I go along here lol)

 

I'll have a look at firebug now, not used it before.

  • Author

Well I've managed to fix the first problem by adding a wrapper in and now everything centres nicely with the background repeating like this

 

I used:

 

div#ebaywrapper {

position:relative;

margin-left:auto;

margin-right:auto;

width:975px;

}

 

Still can't specify the overall page width yet though!

Ive had a quick look, I might not be able to assist too well as im at work.

 

Your HTML & CSS isn't the greatest but appears to be working, it looks to me like your closing a container before the content starts.

  • Author

Your HTML & CSS isn't the greatest but appears to be working, it looks to me like your closing a container before the content starts.

 

HTML & CSS are now cleaned up (it was a bit all over the place)

 

I've got it completely working now!

 

HTML

CSS

eBay

 

I used the .pagewidth div in my CSS and set it to 975px and it overrules the eBay one therefore making my store look much more professional!

 

Very pleased, now for the rest of the redesign!!!

Edited by Grantos

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.