Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

hover element if another element is hovered

Tags:

html

css

I've looked around but can't find the right answer for this... How do I set an element to hover, assuming another is hovered?

Where Assuming "selector" is hovered, it will hover, box 1+2 etc...

http://jsfiddle.net/wgJRQ/

<div id="table">
<div id="row">
    <div id="selector">selector 1</div>
    <div id="selector2">selector 2</div>
</div>
<br />
<div id="row">
    <div id="box1">box 1</div>
    <div id="box2">box 2</div>
</div>
<div id="row">
    <div id="box3">box 3</div>
    <div id="box4">box 4</div>
</div>

like image 517
chris a Avatar asked Feb 14 '26 01:02

chris a


1 Answers

Try something like

#box1:hover, #box1:hover~#box2 {
    display: table-cell;
    background-color:#FFFFFF;
    border:2px solid #666666;
    text-align: center;
    vertical-align: middle;
}

Demo: Fiddle

like image 95
Arun P Johny Avatar answered Feb 16 '26 15:02

Arun P Johny