dmei4 Posted September 21, 2010 Share Posted September 21, 2010 I made an accordion menu using the jqueryui. However, when I implemented on a page I'm working on these dotted outlines appear around the text when hovered. Any suggestions, I'll attach an image. Link to comment Share on other sites More sharing options...
thescientist Posted September 21, 2010 Share Posted September 21, 2010 you could try apply border-style: none to the relevant elements CSS. Link to comment Share on other sites More sharing options...
dmei4 Posted September 21, 2010 Author Share Posted September 21, 2010 you could try apply border-style: none to the relevant elements CSS.Nope, wasn't it :/. Thanks though. Link to comment Share on other sites More sharing options...
thescientist Posted September 21, 2010 Share Posted September 21, 2010 which element(s) did you try it on? do you have a link or some code? Link to comment Share on other sites More sharing options...
jeffman Posted September 21, 2010 Share Posted September 21, 2010 We usually need more than a general description in order to help. Posting links (best) or relevant sections of code/mark-up usually works best. Link to comment Share on other sites More sharing options...
Ingolme Posted September 21, 2010 Share Posted September 21, 2010 This usually is solved like this: a:active { outline: none; } Make sure to put the :active pseudo-class after any :link or :visited ones. Link to comment Share on other sites More sharing options...
jeffman Posted September 21, 2010 Share Posted September 21, 2010 It is odd that (according to dmei4) this behavior occurs in the :hover state. Like Ingolme, I'm accustomed to seeing it, and correcting it, for the :active state. Link to comment Share on other sites More sharing options...
dmei4 Posted September 21, 2010 Author Share Posted September 21, 2010 Sorry. I should have posted the code. Though, I realize this could be an issue with the jquery UI since I'm not using that CSS file they give you when you download UI. <!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=UTF-8" /><title></title><link rel="stylesheet" type="text/css" href="style2_DM.css" media="screen" /><script type="text/javascript" src="jquery-1.4.2.min.js"></script><script type="text/javascript" src="jquery-ui-1.8.5.custom.min.js"></script><script type="text/javascript">$(document).ready(function(){ $("#menu").accordion({ event: 'mouseover'});});</script></head><body><div id="columns"> <div id="menu"> <h1><a href="index.html">WORK</a></h1> <div></div> <h1><a href="#">INFORMATION</a></h1> <div> <a href="#">Information</a> <a href="#">CV</a> <a href="#">Articles</a> <a href="#">Awards</a> </div> <h1><a href="#">CONTACT</a></h1> <div></div> </div> </div></body></html> CSS @charset "UTF-8";/* CSS Document */body {background-image:none;background-color:#FFF;color:#000;font-size:11px;font-family:tahoma;}#columns {overflow:hidden;width:950px;margin: 10px auto;}#nav {color:#666666;float:left;font-family:tahoma;font-size:9px;letter-spacing:1px;line-height:14px;padding:35px 25px 0;text-transform:none;width:160px;min-height:550px;}/* --------- MENU -------------- */#menu { position:fixed; top:33px; left:6%; width:210px; }#menu li { list-style-type:none; padding-left:0px;}/* -------- Normale links ------------- */a:link { color: #000; text-decoration: none;}a:hover { color:#000; background-color: #6F6;} a:visited { color: #999999; text-decoration: none;}/* --- content ---- */#main { width: 850px; float:left; margin-left:120px; padding-bottom:50px;}#main li { list-style-type: none; padding-bottom:0px; padding-left:20px; padding-right: 18px; }h1 { padding-left:0px; font-size:100%; font-weight: bold;}h2 { padding-left:0px; font-size:95%; font-weight: normal; padding-top: 0px;}h5 { padding-left:4px; font-size:100%; width: 100%; padding-bottom: 1px;}/* --- DM Edition --- */#menu a {width:205px; float:left; padding-left:5px;}#menu a:active { outline:none;}#menu p {width:100%; float:left;}#menu div {width:205px; padding-bottom:5px;}#menu h1 { font-weight:100;}#section {width:100%;float:left;padding:0; margin:0;}#year {width:50px;float:left;padding-left: 2em;}#year a {padding:0; margin:0; text-decoration:none; color:000;}#year a:visitied {padding:0; margin:0; text-decoration:none; color:000;}#divider {width: 750px;float:left; display: inline; border-top-width: 1px; border-top-color:#000000; border-top-style:solid; margin-top:25px;}#divider2 {width: 750px;float:left; display: inline; border-top-width: 1px; border-top-color:#000000; border-top-style:solid; margin-top:25px; margin-left:72px;}#work {width:750px; float:left; padding: 15px 10px 0px 10px;}#title {width:100%; float:left;}#images {width:100%; float:left; padding-top: 5px; padding-bottom: 5px;}#caption {width:100%; float:left; padding-bottom:5px;}#text {width:700px; float:left; padding-right:50px;}#images2 {width:200px; height:100%; float:left; padding-top: 5px; padding-bottom: 5px;}#caption2 {width:550px; float:left; padding-bottom:5px;}#text2 {width:550px; float:left;} Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.