Elusive
Newbie-
Posts
8 -
Joined
-
Last visited
Elusive'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> <head> <title> </title> <style type="text/css"> <!-- body { background: #cff; margin: 0; padding: 0; } #list { float: left; width: 200px; background: #f36; } #content { margin-left: 230px; background: #f0c; } #container #list ul { margin: 0; padding: 0; } #container #list li { list-style: none; } #container #list li a { height: 30px; width: 199px; display: block; } .list { border-top: 1px solid black; border-left: 1px solid black; border-right: 1px solid black; text-align: center; } .bottom { border-bottom: 1px solid black; border-top: 1px solid black; border-left: 1px solid black; border-right: 1px solid black; text-align: center; } #container #list a:link, a:visited { background: #360; color: #900; } #container #list a:hover, a:active { background: #f96; color: #cfc; } #container #content img { height: 100px; width: 100px; margin: 20px 20px; border: none; } #container #content a: text-decoration: none; } --> </style> </head> <body> <div id="container"> <div id="list"> <ul> <li><a href="" class="list">home</a></li> <li><a href="" class="list">home</a></li> <li><a href="" class="bottom">home</a></li> </ul> </div> <div id="content"> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> <a href=""><img src="" alt="img" /></a> </div> </div> </body> </html>
-
первое значение по вертикали, а второе по горизонтали. можно и один раз указать ноль, но я уже что бы наверняка знать, что не здесь прокол. а то я в этом деле начинающий, так что страхуюсь)
-
Получилось сделать вот так: <head> <style type="text/css"> <!-- body { margin: 0; padding: 0; } #container { background: #fc6; width: 700px; margin: 0 auto; } #header { height: 150px; background: #f90; margin: 0px 0px; padding: 0 0; } #sidebar { width: 200px; float: left; background: #f30; margin: 0 0: } #content { margin-left: 220px; background: #c06; margin-top: 0; margin-right: 0; margin-bottom: 0; padding: 0 0; position: relative; } #content p { margin: 0 0; } #footer { background: #9cf; margin: 0 0; } #footer p { margin: 0 0; } .clearfloat { clear: both; } --> </style> </head> <body> <div id="container"> <div id="header"> </div> <div id="sidebar"> <ul> <li>Home</li> <li>Home</li> <li>Home</li> </ul> </div> <div id="content"> <p>me Home Home Home Home Home Home Home Home Home Home Hlk</p> </div> <br class="clearfloat" /> <div id="footer"> <p>home</p> </div> </div> </body> Добился желаемого результата. Возник вопрос, почему были пробелы между дивами header и content вызваные параграфами (до того, как я установил margin: 0 0; параграфам в сонтент) если параграфы находяться внутри дива?
-
Возник еще одни вопрос. Подскажите почему content не подымаеться вверх? а находиться ниже sidebar? Заранее спасибо за ответ <style type="text/css"> <!-- body { margin: 0 0; padding: 0; background: #c9f; } #container { background: #ccc; width: 700px; margin: 0 auto: } #header { height: 100px; position: relative; background: #990; } #sidebar { width: 230px; float: left: background: #9c9; } #sidebar li a { text-decoration: none; display: block; text-align: center; line-height: 40px; } #sidebar li { list-style: none; } #sidebar ul { margin: 0; padding: 0; } .table { border-top: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #000; } .bottom { border-top: 1px solid #000; border-bottom: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #000; } #container a:link, a:visited { background: #ccc; color: #0cc; } #container a:hover, a:active { background: #0cf; color: #90c; } #content { margin-left: 250px; background: #c96; padding: 0; margin-top: 0; } .clearfloat { clear: both; } #wrap { margin: 0 0; } #footer { background: #36c; } --> </style> </head> <body> <div id="container"> <div id="header"> <h1>NAME</h1> </div> <div id="wrap"> <div id="sidebar"> <ul> <li><a href="" class="table">Home</a></li> <li><a href=""class="table">Home</a></li> <li><a href=""class="table">Home</a></li> <li><a href=""class="bottom">Home</a></li> </ul> </div> <div id="content"> <p>web web web web web web</p> </div> <br class="clearfloat" /> </div> <div id="footer"> page </div> </div> </body>
-
все гениальное просто)) спасибо большое.
-
Подскажите почему список в диве смещен в право и как это исправить? <style type="text/css"> <!-- #container { width: 250px; position: relative; } #container li a { text-decoration: none; display: block; background: #CCC; } #container li { list-style: none; } --> </style> </head> <body> <div id="container"> <ul> <li><a href="">Home</a></li> <li><a href="">Home</a></li> <li><a href="">Home</a></li> <li><a href="">Home</a></li> </ul> </div> </body>