Как в css задать размер обьекта равное размеру блока?

1) Этот обьект

2) Этот блок

<div>

заменяется на 

<span>

 

.sliderA {
    width: 400px;
    height: 250px;
    border: 1px solid #888;
    position: relative;
    text-align: center;
}

Вот весь css код обьекта

Только что, Onore сказал:

.sliderA {
    width: 400px;
    height: 250px;
    border: 1px solid #888;
    position: relative;
    text-align: center;
}

Вот весь css код обьекта

width: 400px;

лишнее

Ещё один вопрос, как убрать это пустое пространство ниже?

ol.ipsList_reset.cForumList {
    top: -11px;
    position: relative;
}

добавить в custom.css

----> 

Стёрлось не то

отсюда

.sliderA {
    width: 400px;
    height: 250px;
    border: 1px solid #888;
    position: relative;
    text-align: center;
}

убираем:

   border: 1px solid #888;

тот код удалить тогда

Как поднять кнопки выше и растянуть слайдер до размеров блока? И убрать это пустое место в блоке под слайдером?

Ахтунг! Длинный код!

Спойлер

.wrapper {
	height: 250px;
	position: relative;
	width: 700px;
}

.slider {
	background-color: #ddd;
	height: inherit;
	overflow: hidden;
	position: relative;
	width: inherit;
	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
	-moz-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
	-o-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
	box-shadow: 0 0 20px rgba(0, 0, 0, .5);
}

.wrapper > input {
	display: none;
}

.slides {
	height: inherit;
	position: absolute;
	width: inherit;
}

.slide1 { background-image: url(http://habrastorage.org/files/3f2/628/bd5/3f2628bd58c8452db516195cb0c9bfc9.jpg); }
.slide2 { background-image: url(http://habrastorage.org/files/3e1/95d/c7f/3e195dc7f5a64469807f49a14f97ba0e.jpg); }
.slide3 { background-image: url(http://habrastorage.org/files/663/6b1/d4f/6636b1d4f8e643d29eab8c192fc1cea3.jpg); }
.slide4 { background-image: url(http://habrastorage.org/files/e59/424/c04/e59424c046be4dab897d84ab015c87ea.jpg); }
.slide5 { background-image: url(http://habrastorage.org/files/53c/ff6/c1c/53cff6c1caf842368c70b8ef892d8402.jpg); }

.wrapper .controls {
	left: 50%;
	position: absolute;
}

.wrapper label {
	cursor: pointer;
	display: inline-block;
	height: 8px;
	margin: 25px 12px 0 16px;
	position: relative;
	width: 8px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}

.wrapper label:after {
	border: 2px solid #ddd;
	content: " ";
	display: block;
	height: 12px;
	left: -4px;
	position: absolute;
	top: -4px;
	width: 12px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}

.wrapper label {
	cursor: pointer;
	display: inline-block;
	height: 8px;
	margin: 25px 12px 0 16px;
	position: relative;
	width: 8px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	-webkit-transition: background ease-in-out .5s;
	-moz-transition: background ease-in-out .5s;
	-o-transition: background ease-in-out .5s;
	transition: background ease-in-out .5s;
}

.wrapper label:hover, 
#slide1:checked ~ .controls label:nth-of-type(1),
#slide2:checked ~ .controls label:nth-of-type(2),
#slide3:checked ~ .controls label:nth-of-type(3),
#slide4:checked ~ .controls label:nth-of-type(4),
#slide5:checked ~ .controls label:nth-of-type(5) {
	background: #ddd;
}

.slides {
	height: inherit;
	opacity: 0;
	position: absolute;
	width: inherit;
	z-index: 0;
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
	-moz-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
	-o-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
	transition: transform ease-in-out .5s, opacity ease-in-out .5s;
}

#slide1:checked ~ .slider > .slide1,
#slide2:checked ~ .slider > .slide2,
#slide3:checked ~ .slider > .slide3,
#slide4:checked ~ .slider > .slide4,
#slide5:checked ~ .slider > .slide5 {
	opacity: 1;
	z-index: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

 

Пока что всё это выглядит так

.wrapper {
    height: 250px;
    position: relative;
    width: 1053px;
}

.wrapper .controls {
    left: 44%;
    position: absolute;
    margin-top: -45px;
    z-index: 9999;
}

 

Ещё это

.wrapper {
    height: 250px;
    position: relative;
    width: 1053px;
    margin-bottom: -9px;
}

 

Как сделать что бы слайды переключались?

3 минуты назад, Onore сказал:

Как сделать что бы слайды переключались?

они переключаются, а чтобы автоматически для этого нужен скрипт, нужно было искать слайдер переключающийся сам

Хорошо, последний вопрос. В закрытых темах рядом с редактором есть такая строчка:

Как сделать так что бы это было во всех темах а не только в закрытых, но с другим текстом конечно же.

Всё, спасибо большое WOLF, я и сам нашёл)

в шаблоне commentTemplate

перед строчкой:

<div class='ipsComposeArea ipsComposeArea_withPhoto ipsClearfix ipsContained'>

вставить:

<div class="blabla" style="margin-left: 75px;position: relative;">текст</div>

 

Хех, ещё один вопрос появился)

Как сюда добавить код? После чего его вставлять я не могу найти.

У меня возникла проблема с маштабированием в слайдере.

Вот нормальный маштаб

А вот если отдалить страницу

Как это исправить?

15 часов назад, Onore сказал:

У меня возникла проблема с маштабированием в слайдере.

Вот нормальный маштаб

А вот если отдалить страницу

Как это исправить?

никак, либо фиксируете ширину форума либо все будет изменяться

Как зафиксировать ширину форума?

И.. кхм, не могли бы вы помочь мне ещё и с этим? С меня как обычно море репутации.

16 минут назад, Onore сказал:

Как зафиксировать ширину форума?

И.. кхм, не могли бы вы помочь мне ещё и с этим? С меня как обычно море репутации.

Ширина фиксируется обычно в настройках самого стиля, посмотрите там, должно быть

Осталось только это)

http://ipbmafia.ru/topic/17662-css/?do=findComment&comment=131131