1 Востаннє редагувалося FakiNyan (07.12.2013 13:18:15)

Тема: Ширина div-блоків та перенос слів

Раночок. Значить тре мені ото було зробити таку штуку
http://puu.sh/5END3.jpg
ну я її майже зробив.
http://puu.sh/5ENDG.jpg
Структура цього лого-блоку от така

<div id="header">
    <div id="logo">
        <div id="img-logo"><img src="images/comp.png" alt=""></div>
        <div id="img2-logo"><img src="images/gigaspace.png" alt=""></div>
        <div id="text-logo">We provide the power for your computer system</div>
    </div>
    <div id="text"></div>
</div>

а от css

* {
    padding: 0 0;
    margin: 0 0;
}

body {
    width: 100%;
}

#header {
    position: relative;
    height: 109px;
    background: url('images/head-bg.jpg');
    border-bottom: 1px solid black;
    padding-top: 1px;
}

#logo {
    overflow: visible;
    height: inherit;
    margin-top: 1px;
    float: left;
}

#img-logo {
    margin-left: 125px;
    margin-top: 30px;
    float: left;
}

#img2-logo {
    margin-top: 43px;
    float: left;
    margin-left: 13px;
}

#text-logo {
    font-family: "Myriad Pro", Arial;
    font-size: 14px;
    font-weight: bold;
    margin-top: -5px;
    color: #545454;
}

В мене таке питаннячко. Чого блок з текстом такий здоровий?
http://puu.sh/5ENG3.jpg
Чому він не по розмірам тексту? Я знаю, що якщо зробити йому float, то він вже буде по розміру тексту, але тоді він опинится зліва або зправа від логотипу, а треба, щоб був під ним. І чому ширина цього блоку автоматом створилась і текст не влазить в нього? Якась білібірда виходить.
Ось тут ви зможете все в зручому форматі переглянути
http://jsfiddle.net/4h8sB/

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: Ширина div-блоків та перенос слів

http://jsfiddle.net/mFCJq/