Jump to content


Photo

simple CSS float


  • Please log in to reply
5 replies to this topic

#1 otuatail

otuatail
  • Members
  • PipPipPip
  • Advanced Member
  • 954 posts

Posted 31 March 2017 - 10:34 AM

Hi I have an outer div and inside I want to have 2 rows of 3 div's. I have made 2 float left and the third (one on the end) clear.

 

How can I have rows of 3 div's each?

 

TIA

 

Desmond.

 

 

http://whatadrama.de...dmin/config.php


Edited by otuatail, 31 March 2017 - 10:36 AM.


#2 requinix

requinix
  • Administrators
  • Forgotten Administrator
  • 8,488 posts
  • LocationWA

Posted 31 March 2017 - 12:37 PM

float:clear is not a thing.

Float all the DIVs left and give the first of each row, or nth-child(3n+1), a clear:left (which is a thing) so that it won't position itself to the right of any other boxes.

And beware the vertical overflow.

#3 otuatail

otuatail
  • Members
  • PipPipPip
  • Advanced Member
  • 954 posts

Posted 31 March 2017 - 01:51 PM

I have given the first of each row a clear:left but this has made it worse.

 

http://whatadrama.de...dmin/config.php



#4 requinix

requinix
  • Administrators
  • Forgotten Administrator
  • 8,488 posts
  • LocationWA

Posted 31 March 2017 - 02:02 PM

Float all the DIVs left



#5 otuatail

otuatail
  • Members
  • PipPipPip
  • Advanced Member
  • 954 posts

Posted 31 March 2017 - 03:11 PM

Okay all inner div's are now float left!

 

Doesn't look right.

 

What was the  a clear:left all about?


Edited by otuatail, 31 March 2017 - 03:13 PM.


#6 requinix

requinix
  • Administrators
  • Forgotten Administrator
  • 8,488 posts
  • LocationWA

Posted 31 March 2017 - 03:35 PM

The first boxes for each row need float:left AND clear:left.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users