html - I want only about half of my bubble to highlight on hover. Can only seem to highlight the whole bubble - 


<div id="specials">     <h2><a href="/hot-deals/">we have hot deals unbelievable prices!</a> | <a href="/pre-owned/">we have pre-owned boats!</a></h2>       <style>          #specials {             width:695px;              float:left;              padding: 0 10px;              height:38px;              margin:7px auto 10px 13px;             background:#bad6e3;             border:2px solid #005c8a;            -webkit-border-radius: 12px;            -moz-border-radius: 12px;            border-radius: 12px;            -webkit-box-shadow: 0px 0px 4px #dbdbdb; /* saf3-4, ios 4.0.2 - 4.2, android 2.3+ */            -moz-box-shadow: 0px 0px 4px #dbdbdb; /* ff3.5 - 3.6 */            box-shadow: 0px 0px 4px #dbdbdb; /* opera 10.5, ie9, ff4+, chrome 6+, ios 5 */        }        #specials:hover {            width:695px;             float:left;             padding:0 10px;             height:40px;             margin:5px auto 10px 13px;            background:#005c8a;            border:2px solid #005c8a;            -webkit-border-radius: 12px;            -moz-border-radius: 12px;            border-radius: 12px;           -webkit-box-shadow: 0px 0px 4px #dbdbdb; /* saf3-4, ios 4.0.2 - 4.2, android 2.3+ */           -moz-box-shadow: 0px 0px 4px #dbdbdb; /* ff3.5 - 3.6 */           box-shadow: 0px 0px 4px #dbdbdb; /* opera 10.5, ie9, ff4+, chrome 6+, ios 5 */       }       #specials h2 {float:left; margin-top:8px; color:#005c8a; padding-left: 10px;}       #specials h2 span {text-decoration:underline;}       #specials h2 {color:#005c8a; text-decoration:none; font-size:20px;}       #specials h2 span {color:#005c8a;}       #specials h2 a:hover {color:#fff;}     </style> </div>

well, :hover applied containing <div> element, not individual <a> elements, you'll need in order show hover effect on portion of button.

i've created fiddle show how might it: http://jsfiddle.net/tjg8g/

edit

what did...

best bet diff original css , mine main points are:

  1. no :hover styles on container. apply :hover css container <a> elements instead.
  2. set <a> elements display: inline-block
  3. muck padding , line-height <a> elements , remove padding on h2.
  4. adjust border radius rules on individual elements (so left has curve on left , right has curve on right.) required adding class second a.

-

Comments

Post a Comment

Popular posts from this blog

php - regexp cyrillic filename not matches -

i take list of files php glob(."*.pdf") . files have cyrillic names. example: ООО «Рога и копыта» then load company names database , try find them in file names: preg_match("/$firm_name/ui", $file_name, $match); i have problem: firms if $firm_name visually similar $file_name , preg_match says there no match. mb_detect_encoding both variables return utf-8. there problem in file name, or maybe there encoding or something, can not understand, ask help. upd: $file_name='ООО «Рога и копыта»'; preg_match("/... .Рога и копыта./ui", $file_name, $match); as result, ОО «Рога и копыта» , 1 О missing
Read more

c# - OpenXML hanging while writing elements -

Image
i have program pulls data database, caches file , exports data multiple formats (excel, excel 2003, csv). i'm using openxml sdk 2.0 excel work. these export processes run in parallel (using parallel.foreach ), , amount of data can pretty large - e.g. csvs 800mb. during these larger exports, i've noticed writing of xml documents hang. instance, if have 8 exporting in parallel, @ point "pause". hang around same point: //this.writer openxmlwriter created worksheetpart. this.writer.writeelement(new cell() { cellvalue = new cellvalue(value), datatype = cellvalues.string }); when happens, pause debugger (vs2013 in case) , notice threads blocking around same portion of code - bit deeper in openxml sdk - stem call openxmlwriter.writeelement . i dug through source using justdecompile didn't find answers. appears there intermediary stream in use writing isolated storage , is, reason, blocking. underlying stream each of these filestream . here screenshot ...
Read more

sql - Select Query has unexpected multiple records (MS Access) -

i may tired, can't seem figure out happening. have 2 queries. query 1 has 10 fields. query 2 has 5 fields. fields 1 through 3 same in both queries. trying write select query , simple add field 5 query2 query1 result should query1 additional field (query2.field5). i join first 3 fields both queries , choose select records in query1 , in query2 match. don't know sql, use query designer. expect same number of records have query 1 instead have 3 times or more. can tell me doing wrong. tried reversing joins still seem same records. thanks in advance. here query: the fields in common divisionname , supplierid = vendorid , commodityname . select [part revenue exposed query p1].divisionname, [part revenue exposed query p1].commodityname, [part revenue exposed query p1].suppliername, [part revenue exposed query p1].partnumber, [part revenue exposed query p1].partdescription, [part revenue exposed query p1].bucode, ...
Read more