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.

Help with positioning Divs

Featured Replies

Hi,This is my first time posting here, so be nice :)

 

I am redesigning a WordPress eCommerce store for a client and I am having trouble with the footer, it doesn't seem to want to sit underneath the last item on the page. See here: http://www.madelovinglymade.com/ihs/?product=bespoke-wooden-ring

 

I would like it to sit beneath the description tab at all times. This page is exactly how I would like it too look:

 

I have played with the different position and cannot seem to get it where I want.http://www.madelovinglymade.com/ihs/?product=personalised-wooden-christmas-card

 

If anyone could help i would be truly grateful.

 

Regards

Chris

Edited by Chris H

Forgot to say welcome to the forum

 

Try removing margin-top and postion absolute from

.woocommerce .woocommerce_tabs {
clear: both;
float: left;
margin-top: 450px;
position: absolute;
width: 540px;
}

Edited by mteam

  • Author

Forgot to say welcome to the forum

 

Try removing margin-top and postion absolute from

.woocommerce .woocommerce_tabs {
clear: both;
float: left;
margin-top: 450px;
position: absolute;
width: 540px;
}

 

Hi Thanks for the quick reply. When i remove those styles it mucks up the position on different pages that have slightly different content. Try removing those styles and see what happens on this page: http://www.madelovinglymade.com/ihs/?product=fifth-anniversary-personalised-wood-pendant

Remove the clear both also

 

and comment out this and give it a try

 

/*.woocommerce .type-product:after {
   clear: both;
   content: "";
   display: block;
}*/

  • Author

Remove the clear both also

 

and comment out this and give it a try

 

/*.woocommerce .type-product:after {
clear: both;
content: "";
display: block;
}*/

 

You sir are an absolute genius :) Thank you so much. I have been working on this for ages, editing a word press theme has been a pain in the ass :D

 

I have come from this: http://www.madelovinglymade.com/store/?product=personalised-family-tree-christening-box

 

To This: http://www.madelovinglymade.com/ihs/?product=personalised-family-tree-christening-box

 

Not a massive change I know But I think it looks much better.

 

Thanks again.

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.