Полезная информация

Многие проблемы быстрее решаются поиском по форуму и чтением FAQ, чем созданием новой темы и томительным ожиданием ответа.

№116-05-2006 08:21:23

princeandrew
Участник
 
Группа: Members
Зарегистрирован: 27-10-2005
Сообщений: 16

Помогите расположить элементы на странице.

Привет.
Помогите пожалуйста реализовать следующее расположение элементов на страничке.
Div_layout.gif

Собственно проблема с расположением image и той таблички справа.
Они могут быть разной высоты. И блок ниже должен соответственно располагаться ниже наиболее высокого (у меня он всегда идёт ниже правой таблице залезая иногда под картинку). Это первое.

И второе хотелось бы, чтобы правая таблица автоматически выравнивалась по правому края начиная от картинки (т. к. у картинки может быть разная ширина). Сейчас ширина таблицы зависит от содержимого.

Отсутствует

 

№216-05-2006 12:45:24

Al_H
Away
 
Группа: Members
Откуда: SPb
Зарегистрирован: 10-06-2005
Сообщений: 5508

Re: Помогите расположить элементы на странице.

Нужно после обоих блоков добавить div, на класс которого повесить следующее:

Выделить код

Код:

.clearBlocks {clear: both; height: 0; line-height: 0;}

Отсутствует

 

№316-05-2006 12:50:32

RcT
Участник
 
Группа: Members
Откуда: Moscow-Ryazan
Зарегистрирован: 19-04-2005
Сообщений: 593
Веб-сайт

Re: Помогите расположить элементы на странице.

У меня получилось только для IE, может кто посоветует как подправить для Firefox

Выделить код

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>New Document</title>
    <meta http-equiv="content-type" content="text/html; charset=windows-1251">
    <style>
    #myimg {
    	float: left;
    }
    #tbl {
    	float: left;
    }
    #main {
    	float: left;
    }
</style>
  </head>
  <body>
   <div id="header1">header1</div>
   <div id="main">
      <img id="myimg" src="11.jpg" />
      <div id="tbl"><table border="1" width="100%">
                       <caption>Caption</caption>
                       <tr><td>td1<br><br/></td><td>td2</td></tr>
                       <tr><td>td3</td><td>td4</td></tr>
                    </table>
      </div>
   </div>
   <div id="header2">
   header2
   </div>
   <div id="mytext">
   text
   </div> 
  </body>
</html>

Так в IE
Так в FF


Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9a1) Gecko/20061204 GranParadiso/3.0a1

Отсутствует

 

№416-05-2006 15:27:40

princeandrew
Участник
 
Группа: Members
Зарегистрирован: 27-10-2005
Сообщений: 16

Re: Помогите расположить элементы на странице.

Al_H
Спасибо. Действительно помогло. Только с таблицей ещё не разобрался, но так уже в основном всё нормально.
Вставил блок с этими свойствами сразу после  того, который включает в себя (объединяет) картинку и таблицу и всё стало нормально.

Я плохо разбираюсь в свойствах типа clear, outline, float и т.п. Не умею их правильно комбинировать и располагать с их помощью блоки :(

Вот и пришлось сюда обращаться :)

Отсутствует

 

№516-05-2006 16:45:43

Al_H
Away
 
Группа: Members
Откуда: SPb
Зарегистрирован: 10-06-2005
Сообщений: 5508

Re: Помогите расположить элементы на странице.

Я плохо разбираюсь в свойствах типа clear, outline, float и т.п.

Есть замечательный учебник по CSS издательства O'Reilly (у нас - Питер, кажется), только он... длинный.
outline - хорошее свойство, но работает только в Опере и Файрфоксе, причем полная поддержка - только в Файрфоксе.

Отсутствует

 

№617-05-2006 09:43:51

princeandrew
Участник
 
Группа: Members
Зарегистрирован: 27-10-2005
Сообщений: 16

Re: Помогите расположить элементы на странице.

Я веб-программрованием занимаюсь чисто для себя как любитель, то есть практически никак :)
Все эти нужды для своих собственных целей, а также именно для Firefox, ибо другими браузерами я совсем не пользуюсь. :)

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]