f0rym4anin
Newbie-
Posts
5 -
Joined
-
Last visited
f0rym4anin's Achievements
Explorer (1/14)
0
Reputation
-
Чего-то вообще все развалилось
-
Здравствйте, всю жизнь верстал таблицами и не знал бед. Но тут решился освоить верстку дивами Уже буквально закипаю Помогите с простеньким макетиком. <!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, чтоб не нужно было бегать по листингу.
-
уже помогли добрые люди font-size: 0; Ие не любит пустые слои с маленькой высотой
-
Столкнулся с какой-то непонятной проблемой <!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 пикселей, что я с ним ни делаю. Подскажите, как это победить? Заранее спасибо.
-
При наведение мыши убирать пунктирное подчеркивание и давать сплошное
f0rym4anin posted a question in HTML Coding
Здравствуйте Имеется меню которое 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 пунктирное подчеркивание исчезало? Заранее спасибо