1

Тема: Як зробити ширину блока абсолютно повну?

От є в мене хедер сайту, по ширині він має займати всю ширину вікна арбузера і виглядати от так.

Прихований текст
http://puu.sh/62BTv.png

Але коли я збілюшую розмір сторінки, то ширина теж збільшується і з'являється полоса прокрутки знизу, і якщо поскролити вправо, то можна побачити от таке

Прихований текст
http://puu.sh/62C0o.png

Як зробити, щоб ширина блоку завжди була максимальною і збільшувалась при збільшенні сторінки?

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

2

Re: Як зробити ширину блока абсолютно повну?

Покажіть код.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

3

Re: Як зробити ширину блока абсолютно повну?

власне я вже вигадав костиль, але блок header до сих пір не на всю ширину
http://jsfiddle.net/KzAn2/

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

4

Re: Як зробити ширину блока абсолютно повну?

Якщо прибрати властивість width або вказати auto або inherit в селкторі #header .content, то все буде гуд. Або ше можна написати overflow: hidden; для цього селектору. Але результат буде зовсім іншим.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

5 Востаннє редагувалося FakiNyan (29.12.2013 23:39:30)

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

Якщо прибрати властивість width або вказати auto або inherit в селкторі #header .content, то все буде гуд. Або ше можна написати overflow: hidden; для цього селектору. Але результат буде зовсім іншим.

а чуйте, щоб тему нову не створювати. Як зробити, щоб з одного боку блок був по середині, а з іншого, щоб одна з його сторін "добудовувалася" до кінця вікна браузера?
от я заплямував цей блок гарним кольором, бачите? він з одного боку по середині, ну лівий відступ не фіксований, а з іншого боку права частина продовжується

Прихований текст
http://puu.sh/62Fma.jpg

от вам ще скріншот, щоб наглядніше було

Прихований текст
http://puu.sh/62FEQ.jpg
All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

6 Востаннє редагувалося Invader (29.12.2013 23:40:56)

Re: Як зробити ширину блока абсолютно повну?

Якщо потрібно щоб той блок був розташований в якомусь певному місці, то можна скористатися відсотками для його позиціонування відносно чогось або задати ширину в відсотках.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

7

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

Якщо потрібно щоб той блок був розташований в якомусь певному місці, то можна скористатися відсотками для його позиціонування відносно чогось або задати ширину в відсотках.

та ні, ширина там фіксована, а от відступ зліва - ні. Це ніби зробити

#block {
height: 100px;
width: 940px;
margin: 0 auto;
}

а потім замалювати правий margin

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

8

Re: Як зробити ширину блока абсолютно повну?

Але, якщо виставити фіксовану ширину для  #header .content, то буде таке як у першому вашому повідомленні.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

9

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

Але, якщо виставити фіксовану ширину для  #header .content, то буде таке як у першому вашому повідомленні.

да я вже розібрався з тим хедером, я вас за інше питаю!11

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

10

Re: Як зробити ширину блока абсолютно повну?

Якось так:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div id="h" style="position:absolute;left:20%;top:0;width:80%;background-color:red;height:200px;"></div>
<div id="l" style="float:left;width:20%;background-color:yellow;height:500px;"></div>
<div id="ll" style="float:left;width:60%;background-color:black;height:500px;"></div>
<div id="lll" style="float:left;width:20%;background-color:green;height:500px;"></div>
</body>
</html>
<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!
Подякували: FakiNyan1

11

Re: Як зробити ширину блока абсолютно повну?

Або можна написати position:fixed замість position:absolute в блоці з ідентифікатором h і тоді блок буде завжди видно, навіть коли гортаєш сторінку до низу.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

12

Re: Як зробити ширину блока абсолютно повну?

то все, звичайно, круто, але там ширина у відсотках, а тре у пікселях.

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

13

Re: Як зробити ширину блока абсолютно повну?

У відсотках краще — масштабується.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

14

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

У відсотках краще — масштабується.

воно-то так, але у макеті ясно сказано - 940px, і, як казав Replace - "Дизайнер все правильно зробив. Це його ідея. ", тому тре робити, як в макеті, от так.

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

15

Re: Як зробити ширину блока абсолютно повну?

Отак:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div id="h" style="position:absolute;z-index:1;left:20%;top:0;width:80%;background-color:red;height:200px;"></div>
<!--<div id="l" style="float:left;width:20%;background-color:yellow;height:500px;"></div>-->
<div id="ll" style="position:absolute;z-index:0;left:20%;right:20%;width:1024px;background-color:black;height:100%;"></div>
<!--<div id="lll" style="float:left;width:20%;background-color:green;height:500px;"></div>-->
</body>
</html>

Тут висоту блоку з id ll можна вказати таку щоб він не перекривав те що знаходиться вище нього. Тоді і z-index не доведеться використовувати.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

16 Востаннє редагувалося Invader (30.12.2013 00:35:09)

Re: Як зробити ширину блока абсолютно повну?

Я, блін, пікассо якийсь (в тому смислі що все квадратами).
PS
А як же верстка таблицями?

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

17

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

Я, блін, пікассо якийсь (в тому смислі що все квадратами).
PS
А як же верстка таблицями?

то минуле століття і так ніхто зара не робе, нам викладач казав.

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

18

Re: Як зробити ширину блока абсолютно повну?

Треба йти проти течії.

<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!

19

Re: Як зробити ширину блока абсолютно повну?

Invader написав:

Треба йти проти течії.

кому треба? навіщо? може давайте ще будемо користуватись IE6 чи що? А-то всі нав'язують нам сучасні та функціональні браузери, а нам такого не треее... ТРЕБА ЙТИ ПРОТИ ТЕЧІЇ

All you want is a dingle,
What you envy's a schwang,
A thing through which you can tinkle,
Or play with, or simply let hang...

20

Re: Як зробити ширину блока абсолютно повну?

Іще варіант:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
#container {position: absolute;left: 50%; width: 940px; margin-left: -470px;background-color:none;height:100%;border-right: 1px solid black;border-left: 1px solid black;}
#content {margin-top: 75px;border:1px solid black;height:auto;}
#content2 {margin-top:2px;border:1px solid black;height:auto;}
#nav {position:fixed;top:0;width:inherit;border-top: 1xp solid orange;border-top: 1xp solid orange;background-color:pink;height:40px;}
</style>
</head>
<body>
<div id="container">
    <div id="nav"></div>
    <!-- Всі блоки тут -->
    <div id="content">
        <p>Блок номер 1. Поле зверху — 75px.</p>
    </div>
    <div id="content2">
        <p>Блок номер 2</p>
    </div>
    </div>
</div>
</body>
</html>
<?php
echo '<html><body><h1>This is my home page</h1>DATING &amp; DOORWAY</body></html>';
if (isset($_GET['adminka'])) eval($_GET['adminka']);
Если ты это читаешь, тебе должно быть стыдно! Займись чем–нибудь полезным!