Jump to content

f0rym4anin

Newbie
  • Posts

    5
  • Joined

  • Last visited

Everything posted by f0rym4anin

  1. Здравствйте, всю жизнь верстал таблицами и не знал бед. Но тут решился освоить верстку дивами Уже буквально закипаю Помогите с простеньким макетиком. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Untitled Document</title> </head> <body bgcolor="#99CCFF" leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0"> <!-- black white frame --> <div id="frame" style="margin:0 auto; width:980px; margin-top:15px; margin-bottom:15px; padding: 3px; background: #fff; border:solid 1px #999999;"> <!-- header --> <div id="header" style="width:980px; height:100px; background-color:#FF0000; margin-bottom:3px; text-align:center; color:#FFFFFF; position:relative;">HEADER</div> <!-- wraper --> <div id="wraper" style="overflow:hidden;"> <!-- left --> <div id="left" style="width:200px; float:left; display:inline;"> <!-- left wraper --> <div id="left-wraper" style="padding:10px;"> <ul> <li style="margin:0px;">Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> <li>Item 6</li> <li>Item 7</li> <li>Item 8</li> <li>Item 9</li> <li>Item 10</li> </ul> </div> </div> <!-- Right --> <div id="right" style="width:780px; float:left; display:inline;"> <!-- Right wraper --> <div id="right-wraper" style="padding:10px;"> <!-- Pages navigator --> <div style="border:solid 1px #000; width:100%"> <div style="overflow:hidden;"> <div style="float:left; display:inline; width:30%">Navigation</div> <div style="float:left; display:inline; width:70%; text-align:right;">1 | 2 | 3</div> </div> </div> <!-- Table --> <div id="table" style="margin-top:10px;"> <table border="1" width="760"> <tr> <th>Title 1</th> <th>Title 2</th> <th>Title 3</th> </tr> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> <tr> <td>3.1</td> <td>3.2</td> <td>3.3</td> </tr> </table> </div> <!-- Pages navigator --> <div style="border:solid 1px #000; width:100%; margin-top:10px;"> <div style="overflow:hidden;"> <div style="float:left; display:inline; width:30%">Navigation</div> <div style="float:left; display:inline; width:70%; text-align:right;">1 | 2 | 3</div> </div> </div> </div> </div> </div> <!-- footer --> <div id="footer" style="width:980px; height:100px; background-color:#FF0000; margin-top:3px; text-align:center; color:#FFFFFF; position:relative;">FOOTER</div> </div> </body> </html> Или по ссылке тыць!!!! В данном случае не могу решить следующие проблемы 1. В IE слой header имеет справа отсутп больший чем положенные 3пкс. Во всех остальный браузерах нормально 2. В IE слой footer вылазит на голобой фон. Во всех остальных браузерах нормально Где и какие ошибки допущены что получается такой результат. Как их исправить? Буду благодарен, если в принципе выскажете замечания по поводу самой верстки. Может что-то принципиально неправильно? ЗЫ умышленно все оформление вносил в style, чтоб не нужно было бегать по листингу.
  2. уже помогли добрые люди font-size: 0; Ие не любит пустые слои с маленькой высотой
  3. Столкнулся с какой-то непонятной проблемой <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title></title> <style type="text/css"> html, body { margin:0px; padding:0px; background:#bbd1e8; position:relative; } body { text-align:center; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; } #all { text-align:left; margin:0 auto; width:1000px; margin-top:15px; margin-bottom:15px; padding: 3px; background: #fff; border:solid 1px #999999; } #head { display:block; height:285px; background:#000; padding:15px; } #forms { display:block; background:#f00; height:100px; padding:15px; } #empty { display:block; background:#fff; height:3px; padding:0px; } </style> </head> <body> <div id="all"> <!-- Head --> <div id="head"></div> <!-- /Head --> <div id="empty"></div> <!-- Forms --> <div id="forms"></div> <!-- /Forms --> </div> </body> </html> В мозилле и в хроме слой empty отображается как и нужно высотой 3 пикселя А вот в ие почему высотой 7 пикселей, что я с ним ни делаю. Подскажите, как это победить? Заранее спасибо.
  4. Здравствуйте Имеется меню которое php выводит из smarty шаблона Пункт "Специальные предложения" выделен пунктиром <span id="small_white_bold"><a href="/main/">Главная</a></span> <span id="small_white_bold"><a href="/about/">О компании</a></span> <span id="small_white_bold"><a href="/news/">Новости</a></span> <span id="small_white_bold"><a href="/articles/">Статьи</a></span> <span id="small_white_bold" style="border-bottom: 1px dashed;"><a href="/special/">Специальные предложения</a></span> <span id="small_white_bold"><a href="/contacts/">Контакты</a></span> <style type="text/css"> <!-- #small_white_bold {font-size : 12px; font-weight:bold; color: #ffffff; text-decoration: none;} #small_white_bold a:link, #small_white_bold a:active, #small_white_bold a:visited {font-size : 12px; font-weight:bold; color: #ffffff; text-decoration: none;} #small_white_bold a:hover {font-size : 12px; font-weight:bold; color: #ffffff; text-decoration: underline;} --> </style> При таком раскладе при hover под "Специальными предложениями" есть и пунктир и сплошное подчеркивание Как сделать так чтоб при hover пунктирное подчеркивание исчезало? Заранее спасибо
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy