3 Replies - 564 Views - Last Post: 28 November 2009 - 03:55 PM

#1 Daily.matters  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 42
  • Joined: 20-November 09

Problems with CSS floats and positioning

Post icon  Posted 27 November 2009 - 09:06 AM

I everybody,

I'm having a problem with CSS as i can't seem to put some images in the places i want maybe because i'm working with floats instead have absolute positioning..
I have 4 images in the same div, then in CSS i try to center the images, but everything i get is two images on each side, i can't center them...
Here is the code i'm currently using:

#right_mid_1, #right_mid_2{
	float: left;
	width: 168px;
	padding: 10px 0;
	text-align: center;
	color: #000000;
}

#right_mid_3 {
	float: right;
	width: 168px;
	padding: 10px 0;
	text-align: center;
}

#right_mid_4 {
	float: right;
	width: 168px;
	padding: 10px 0;
	text-align: center;


I tried to use
float: center;
but still can't do it.

Can anyone help me with this one ?

Thx in advance ;)

(i attached a photo of the problem i'm having)

Attached image(s)

  • Attached Image


Is This A Good Question/Topic? 0
  • +

Replies To: Problems with CSS floats and positioning

#2 ahmad_511  Icon User is offline

  • MSX
  • member icon

Reputation: 131
  • View blog
  • Posts: 722
  • Joined: 28-April 07

Re: Problems with CSS floats and positioning

Posted 28 November 2009 - 02:17 AM

Hi,
text-align property is applied to the contents of targeted element while float is applied to the targeted element itself
that's why you didn't get the benefit of using text-align and also you ggot two images aligned to the right and two to the left
so,
give the div that contains the images an id (container for example)
and try this:
#right_mid_1, #right_mid_2,#right_mid_3 ,#right_mid_4{
    width: 168px;
    padding: 10px 0;
    color: #000000;
}

#container{
	text-align:center;
}



hope it helps
Was This Post Helpful? 0
  • +
  • -

#3 Daily.matters  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 42
  • Joined: 20-November 09

Re: Problems with CSS floats and positioning

Posted 28 November 2009 - 12:53 PM

Hey,

i'm currently out of town, so i don't have my computer with me. I just want to thank you, and as soon as i try this, i will tell how it went.

Thx a lot ;)
Was This Post Helpful? 0
  • +
  • -

#4 Lemur  Icon User is offline

  • Pragmatism over Dogma
  • member icon


Reputation: 1383
  • View blog
  • Posts: 3,514
  • Joined: 28-November 09

Re: Problems with CSS floats and positioning

Posted 28 November 2009 - 03:55 PM

Did you remember to clear the floats? On occasion it can make some interesting bugs if you don't.

Use all float left, what it's doing off of that is floating half to the absolute left and half to the absolute right instead of displaying them inline like you want.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1