CSS проблем!

Styl3rbg · 6 Март 2011

Имам проблем с CSS ,дълго време се мъча да оправя следното:
http://styl3r-code.hit.bg/
Боксовете в центъра,ляво,дясно не са равни с title-a на самият бокс? Как да го оправя?
[css]http://styl3r-code.hit.bg/style.css[/css]

tedo96 · 6 Март 2011

Еми... Естествено.. Самите долни картинки са по-големи от шапките.

Styl3rbg · 6 Март 2011

Тедо, долното не е картинка

dashe · 6 Март 2011

[css]width:210px;[/css]
Сложи px;
А до колкото излиза от страни , може да е от някой padding :wink:

dELux_nike · 6 Март 2011

[css]html,body {background-color:gray;;smargin:0;padding:0;overflow:auto;font:12px verdana,arial,sans-serif;}
form,p,img {margin:0;padding:0;border:0;}
a {color:#fff;text-decoration:none;}
a:hover {color:#c8c4c4;text-decoration:underline;}
#main {width:950px;margin:0 auto;}
#header {width:933;height:195px;background:url("images/header.png") no-repeat;}
#menu {height:52px;margin:7px 0 0 0;padding:0;background:url("images/menu.png") no-repeat;list-style-type:none;}
#menu li {float:left;margin:0 0 0 20px;padding:15px 0 0 0;display:inline;}
#menu li a {font-size:15px;}
.side {width:193px;float:left;display:inline;margin:1px 0 0 0;}
.side2 {width:193px;float:right;display:inline;margin:1px 0 0 0;}
.side_box {width:210;margin:0 0 10px 0;}
.side_box_top {width:210;height:25px;background:url("images/side_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:17px 10px 0 3px;}
.side_box_bottom {width:208;background:#5d5d5d left bottom;border:1px solid black;padding:1px 3px 3px 4px;}
.login_input {width:148px;height:24px;margin:0 0 0 11px;background:url("images/login_input.png") no-repeat;padding:8px 3px 0 3px;display:inline-block;}
.login_input input {width:148px;background:transparent;border:none;font:12px verdana,arial,sans-serif;}
.login_text {margin:6px 0 4px 12px;font-weight:bold;display:inline-block;}
.login_help {text-align:center;display:block;margin:5px 0 3px 0;}
#login_button {width:55px;margin:10px 0 0 61px;}
#center {width:436px;margin:12px 5px 0 25px;float:left;}
#advertisment {margin:0 0 9px 10%;}
.center_box {width:530px;margin:0 -6px 6px 6px;}
.center_box_top {height:25px;background:url("images/center_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:15px 3px 0 3px;}
.center_box_bottom {background:#5d5d5d left bottom;border:1px solid black;border-right:1px solid black;padding:0 3px 5px 4px;}
.hr_green {margin:5px 4px 1px 4px;border-top:1px solid #dddddd;border-bottom:none;height:0;}
.autor {float:right;margin:0 5px 0 0;}
.autor_r {color:#dddddd;font-weight:bold;}
.clear {clear:both;font-size:0;line-height:0;display:block;}
#footer {width:943px;height:40px;margin:26px auto 0 auto;background:url("images/footer.png") no-repeat;font-size:15px;text-align:center;padding:15px 3px 0 3px;color:#dddddd;}[/css]

Styl3rbg · 6 Март 2011

dELux_nike каза:
[css]html,body {background-color:gray;;smargin:0;padding:0;overflow:auto;font:12px verdana,arial,sans-serif;}
form,p,img {margin:0;padding:0;border:0;}
a {color:#fff;text-decoration:none;}
a:hover {color:#c8c4c4;text-decoration:underline;}
#main {width:950px;margin:0 auto;}
#header {width:933;height:195px;background:url("images/header.png") no-repeat;}
#menu {height:52px;margin:7px 0 0 0;padding:0;background:url("images/menu.png") no-repeat;list-style-type:none;}
#menu li {float:left;margin:0 0 0 20px;padding:15px 0 0 0;display:inline;}
#menu li a {font-size:15px;}
.side {width:193px;float:left;display:inline;margin:1px 0 0 0;}
.side2 {width:193px;float:right;display:inline;margin:1px 0 0 0;}
.side_box {width:210;margin:0 0 10px 0;}
.side_box_top {width:210;height:25px;background:url("images/side_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:17px 10px 0 3px;}
.side_box_bottom {width:208;background:#5d5d5d left bottom;border:1px solid black;padding:1px 3px 3px 4px;}
.login_input {width:148px;height:24px;margin:0 0 0 11px;background:url("images/login_input.png") no-repeat;padding:8px 3px 0 3px;display:inline-block;}
.login_input input {width:148px;background:transparent;border:none;font:12px verdana,arial,sans-serif;}
.login_text {margin:6px 0 4px 12px;font-weight:bold;display:inline-block;}
.login_help {text-align:center;display:block;margin:5px 0 3px 0;}
#login_button {width:55px;margin:10px 0 0 61px;}
#center {width:436px;margin:12px 5px 0 25px;float:left;}
#advertisment {margin:0 0 9px 10%;}
.center_box {width:530px;margin:0 -6px 6px 6px;}
.center_box_top {height:25px;background:url("images/center_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:15px 3px 0 3px;}
.center_box_bottom {background:#5d5d5d left bottom;border:1px solid black;border-right:1px solid black;padding:0 3px 5px 4px;}
.hr_green {margin:5px 4px 1px 4px;border-top:1px solid #dddddd;border-bottom:none;height:0;}
.autor {float:right;margin:0 5px 0 0;}
.autor_r {color:#dddddd;font-weight:bold;}
.clear {clear:both;font-size:0;line-height:0;display:block;}
#footer {width:943px;height:40px;margin:26px auto 0 auto;background:url("images/footer.png") no-repeat;font-size:15px;text-align:center;padding:15px 3px 0 3px;color:#dddddd;}[/css]

Не пак е така ,само че боксовете са по малки?

tedo96 · 6 Март 2011

[css]html,body {background-color:gray;;smargin:0;padding:0;overflow:auto;font:12px verdana,arial,sans-serif;}
form,p,img {margin:0;padding:0;border:0;}
a {color:#fff;text-decoration:none;}
a:hover {color:#c8c4c4;text-decoration:underline;}
#main {width:950px;margin:0 auto;}
#header {width:933px;height:195px;background:url("images/header.png") no-repeat;}
#menu {height:52px;margin:7px 0 0 0;padding:0;background:url("images/menu.png") no-repeat;list-style-type:none;}
#menu li {float:left;margin:0 0 0 20px;padding:15px 0 0 0;display:inline;}
#menu li a {font-size:15px;}
.side {width:193px;float:left;display:inline;margin:1px 0 0 0;}
.side2 {width:193px;float:right;display:inline;margin:1px 0 0 0;}
.side_box {width:210px;margin:0 0 10px 0;}
.side_box_top {width:210px;height:25px;background:url("images/side_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:17px 10px 0 3px;}
.side_box_bottom {width:208px;background:#5d5d5d left bottom;border:1px solid black;padding:1px 3px 3px 4px;}
.login_input {width:148px;height:24px;margin:0 0 0 11px;background:url("images/login_input.png") no-repeat;padding:8px 3px 0 3px;display:inline-block;}
.login_input input {width:148px;background:transparent;border:none;font:12px verdana,arial,sans-serif;}
.login_text {margin:6px 0 4px 12px;font-weight:bold;display:inline-block;}
.login_help {text-align:center;display:block;margin:5px 0 3px 0;}
#login_button {width:55px;margin:10px 0 0 61px;}
#center {width:436px;margin:12px 5px 0 25px;float:left;}
#advertisment {margin:0 0 9px 10%;}
.center_box {width:530px;margin:0 -6px 6px 6px;}
.center_box_top {height:25px;background:url("images/center_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:15px 3px 0 3px;}
.center_box_bottom {background:#5d5d5d left bottom;border:1px solid black;border-right:1px solid black;padding:0 3px 5px 4px;}
.hr_green {margin:5px 4px 1px 4px;border-top:1px solid #dddddd;border-bottom:none;height:0;}
.autor {float:right;margin:0 5px 0 0;}
.autor_r {color:#dddddd;font-weight:bold;}
.clear {clear:both;font-size:0;line-height:0;display:block;}
#footer {width:943px;height:40px;margin:26px auto 0 auto;background:url("images/footer.png") no-repeat;font-size:15px;text-align:center;padding:15px 3px 0 3px;color:#dddddd;}[/css]

Styl3rbg · 6 Март 2011

tedo96 каза:
[css]html,body {background-color:gray;;smargin:0;padding:0;overflow:auto;font:12px verdana,arial,sans-serif;}
form,p,img {margin:0;padding:0;border:0;}
a {color:#fff;text-decoration:none;}
a:hover {color:#c8c4c4;text-decoration:underline;}
#main {width:950px;margin:0 auto;}
#header {width:933px;height:195px;background:url("images/header.png") no-repeat;}
#menu {height:52px;margin:7px 0 0 0;padding:0;background:url("images/menu.png") no-repeat;list-style-type:none;}
#menu li {float:left;margin:0 0 0 20px;padding:15px 0 0 0;display:inline;}
#menu li a {font-size:15px;}
.side {width:193px;float:left;display:inline;margin:1px 0 0 0;}
.side2 {width:193px;float:right;display:inline;margin:1px 0 0 0;}
.side_box {width:210px;margin:0 0 10px 0;}
.side_box_top {width:210px;height:25px;background:url("images/side_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:17px 10px 0 3px;}
.side_box_bottom {width:208px;background:#5d5d5d left bottom;border:1px solid black;padding:1px 3px 3px 4px;}
.login_input {width:148px;height:24px;margin:0 0 0 11px;background:url("images/login_input.png") no-repeat;padding:8px 3px 0 3px;display:inline-block;}
.login_input input {width:148px;background:transparent;border:none;font:12px verdana,arial,sans-serif;}
.login_text {margin:6px 0 4px 12px;font-weight:bold;display:inline-block;}
.login_help {text-align:center;display:block;margin:5px 0 3px 0;}
#login_button {width:55px;margin:10px 0 0 61px;}
#center {width:436px;margin:12px 5px 0 25px;float:left;}
#advertisment {margin:0 0 9px 10%;}
.center_box {width:530px;margin:0 -6px 6px 6px;}
.center_box_top {height:25px;background:url("images/center_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:15px 3px 0 3px;}
.center_box_bottom {background:#5d5d5d left bottom;border:1px solid black;border-right:1px solid black;padding:0 3px 5px 4px;}
.hr_green {margin:5px 4px 1px 4px;border-top:1px solid #dddddd;border-bottom:none;height:0;}
.autor {float:right;margin:0 5px 0 0;}
.autor_r {color:#dddddd;font-weight:bold;}
.clear {clear:both;font-size:0;line-height:0;display:block;}
#footer {width:943px;height:40px;margin:26px auto 0 auto;background:url("images/footer.png") no-repeat;font-size:15px;text-align:center;padding:15px 3px 0 3px;color:#dddddd;}[/css]

Не..

dashe · 6 Март 2011

Почни от начало,можеш и да видиш и за някой CSS layout с 3 колони, както е твоят в случая. http://matthewjamestaylor.com/blog/perfect-3-column.htm
Цъкаш Download this layout и воала.
После си почваш да си слагаш твойте неща.
Пишеш елемент по елемент и гледаш как е.
Ако не стане бам и тогава търсиш проблема.
Не накрая когато си написал всичко и има бол проблеми

dashe · 6 Март 2011

АХХАХА

Да не говорим че и проблема ти идва от самите картинки.
Не са изрязани добре.

И как искаш?Виш как оставяш място ти после гледаш картинката уш е 210x46?Това е реалният размер,но това бялото място ти е по 5px някъде и за това става така да излиза.
Ти си мислиш че размера е един а тои реално е съвсем друг.

Ето това са реалните размери вече.
Промени размерите и ще стане

[css].side {width:197px;float:left;display:inline;margin:1px 0 0 0;}
.side_box_top {width:197px;height:32px;background:url("images/side_box_top.png") no-repeat;color:#fff;font-size:15px;text-align:center;padding:17px 10px 0 3px;}
.side_box_bottom {width:197px;background:#5d5d5d left bottom;border:1px solid black;padding:1px 3px 3px 4px;}
[/css]

Styl3rbg · 6 Март 2011

Така е още по зле..

tedo96 · 7 Март 2011

Започни от начало...

PHP_Masters · 7 Март 2011

Това е станало защото си дал margin на самия див, сложи текста в едно друго дивче, и тогава му дай margin да видиш как, ще се оправи

Edit: и ти защо само на текст използваш margin, замени го с padding

Styl3rbg · 7 Март 2011

Вече дадох дизайна на човека и толкова

Мерси на всички ЛОК!

CSS проблем!

Styl3rbg

Registered

tedo96

Registered

Styl3rbg

Registered

dashe

Registered

dELux_nike

Registered

Styl3rbg

Registered

tedo96

Registered

Styl3rbg

Registered

dashe

Registered

dashe

Registered

Styl3rbg

Registered

tedo96

Registered

PHP_Masters

Registered

Styl3rbg

Registered