Центриране на <div>

vinsbg

Registered
Опитвам се да преместя съдържанието на този див в центъра, но не успявам.
Може ли малко помощ?
Код:
.home .bar {
	width: 200px;
	float: left; // Държа го така, защото не успявам да го центрирам
	padding: 5px 50px 0 0;
	height: 250px;
	overflow: hidden;
}

edit:
По-точно да обясня.
В този див имам 3 по-малки дива. Искам тях да преместя в центъра на големия див.
 
Има един семпъл начин:

[css]
.home{
width: 100%;
text-align: center;
}
.home .bar{
display: inline-block;
}
[/css]
 
Външния див колко е голям ? padding не мисля, че ще ти свърши точната работа, защото разширяваш външния. Използвай margin.
 
С margin също разширява големия див ...
Код:
#body .home {
	width: auto;
	float: none;
	margin: 0;
	padding: 0;
	
}
Това ми е големия див.
 
Как искаш да центрираш нещо в нещо, което има стойности, които се увеличават автоматично?
 
Код:
#body .home {
   width: auto;
   float: none;
   margin: 0 auto;
  text-align: center;
   padding: 0;
}

?
 
Revelation каза:
Как искаш да центрираш нещо в нещо, което има стойности, които се увеличават автоматично?

Защо не?
Точно с метода, който съм описал е възможно.
 
Revelation каза:
Как искаш да центрираш нещо в нещо, което има стойности, които се увеличават автоматично?
Това ми е проблема и за това писах за помощ. Ако не става така, как по друг начин.

deam0n каза:
#body .home {
width: auto;
float: none;
margin: 0 auto;
text-align: center;
padding: 0;
}
Не, така ми центрира само текста във вътрешния див.

Такава е ситуацията. body .home ми е големия див, а трите малки са
.home .bar. Дори стоят така, както е на снимката. Искам да ги изместя всичките малко в дясно, за да са централно. Когато ги местя на дясно се разширява големия див..
5552.jpg
 
Пробвай трите дива да ги сложиш в един междинен див :
.bar1{
margin-left: auto;
margin-right: auto;
width: 300px; /*колкото е ширината на вътрешните+границите*/
}

А от външния махни падинга и вместо него сложи маргини на вътрешните 3:
margin: 5px 25px 0 25px;
 
До колкото виждам, той иска и отгоре да има разстояние и ако е възможно родителския да няма определена дължина.
 
Revelation каза:
До колкото виждам, той иска и отгоре да има разстояние и ако е възможно родителския да няма определена дължина.

Добре ей така е с widht: auto и с padding. http://dabblet.com/gist/5927138

При твоя примерно children са с float: left и не се центрират. При мен съм ги направил да са display: inline, за да са на един ред.
 
Revelation каза:
До колкото виждам, той иска и отгоре да има разстояние и ако е възможно родителския да няма определена дължина.

Да, за това предлагам в този със стил .bar да сложи още един див със стил .bar1 и с фиксирана ширина, а в него - трите вътрешни .
 
deam0n каза:
Revelation каза:
До колкото виждам, той иска и отгоре да има разстояние и ако е възможно родителския да няма определена дължина.

Добре ей така е с widht: auto и с padding. http://dabblet.com/gist/5927138

При твоя примерно children са с float: left и не се центрират. При мен съм ги направил да са display: inline, за да са на един ред.

Къде видя, че не се центрират и че не са на един ред ? В зависимост да си увеличава margin-а и все ще си стоят центрирани. Твоя телевизор ли е счупен - не знам.
 
Не мога да разбера какво умувате. :D
Доколкото разбрах това е търсеният резултат.

http://dabblet.com/gist/5927349
 
Revelation каза:
deam0n каза:
Revelation каза:
До колкото виждам, той иска и отгоре да има разстояние и ако е възможно родителския да няма определена дължина.

Добре ей така е с widht: auto и с padding. http://dabblet.com/gist/5927138

При твоя примерно children са с float: left и не се центрират. При мен съм ги направил да са display: inline, за да са на един ред.

Къде видя, че не се центрират и че не са на един ред ? В зависимост да си увеличава margin-а и все ще си стоят центрирани. Твоя телевизор ли е счупен - не знам.

На твоя пример, за дебъг му слагам на #parent width:1000px; и не се центрират. Поне не под Chrome.
 
deam0n каза:
Revelation каза:
deam0n каза:
Добре ей така е с widht: auto и с padding. http://dabblet.com/gist/5927138

При твоя примерно children са с float: left и не се центрират. При мен съм ги направил да са display: inline, за да са на един ред.

Къде видя, че не се центрират и че не са на един ред ? В зависимост да си увеличава margin-а и все ще си стоят центрирани. Твоя телевизор ли е счупен - не знам.

На твоя пример, за дебъг му слагам на #parent width:1000px; и не се центрират. Поне не под Chrome.

При положение, че автора не му трябва зададена дължина, защо аджеба да слагам 1000px ?

Плюс това, въобще не ми харесват твоите врътки. В .children наслагал 5 пъти margin, абе някакви шарении.

Няма смисъл да пишем по темата повече, докато автора не се отзове и не каже въобще дали това ще иска.
 
Тези 1000 пиксела ги слагам само с идеята да видя дали ще се центрират child елементите. И не става.

Код:
#parent {
	border: 1px solid black;
	width: auto;
	float: left;
	text-align: center;
	padding: 20px;
}


#parent .children {
	width: 250px;
	height: 250px;
	border: 1px solid red;
	margin: 0 auto;
	display: inline-block;
	text-align: left;
}
 

Горе