Streaming live at 10am (PST)

Issues with making a div centre


#1

Hello,

I'm having issues making "footer div" to centre in a col I've tried number of methods but no joy.

Some reason there all going to the left.

https://preview.webflow.com/preview/cupcakes?preview=e95f4692491974433f0a587c8993b823


#2

You need to assign a width (maybe 80%) to your footer div.And you'll need to put your image inside the footer div if you want it to come along with the text.

Cute site! :slightly_smiling:

Good luck!


#3

hmm strange, the image is inside the footer div but no joy?


#4

Ah, remove the float from your footer div. :slightly_smiling:


#5

Still not quite right, the FAQ is miles away from its image which I guess because its only 3 letters.... Even if the FAQ was next to the image it wouldn't still be quite central.

Ahh!


#6

Part of it is that your structure is flipped. It should look like this:

Footer Div (centered, with some width, and no float)
-- Image (float: left, clear: none)
-- Text (float:left, clear: none)

Sorry, I assumed that you would make these changes. Make sure your elements are in the order you want them when you're applying floats and clears to them. In your case, image first, then text inside your floater div.


#7

Hey @Matty I tried the following style changes:

Remove the float and clear styles from your text fields, set them to display: Inline. Then change your font line-height settings to about 50px (or the same height as your image heights). And set your text to align center.

Here's a quick GIF:

​Please let me know if this solves the problem, if not, I’m happy to help further :slightly_smiling:


#8

Thanks both, worked a treat.


#9

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.