html - Rollover within a table keeps going vertical -


I am trying to create a table that displays 3 pictures horizontally, which varies on different rollhowers .

Thank you

  & lt; Table style = "width: 678px; height: 380px; cellpadding: 0; cell spacing: 1" & gt; & Lt; Tbody & gt; & Lt; Tr align = "center" & gt; & Lt; Td style = "width: 220px; height: 380px;" & Gt; & Lt; Style type = "text / css" & gt; # First-div.rolloverA {display: block; Width: 225px; Height: 380 px; Background image: URL (IMG1A); } #first-div.rollover a: hover {background-image: url (IMG1b); } & Lt; / Style & gt; & Lt; Div class = "rollover" & gt; & Lt; / A & gt; & Lt; / Td> & Lt; Td style = "width: 220px; height: 380px;" & Gt; & Lt; Style type = "text / css" & gt; # II-div.rollover A {display: block; Width: 225px; Height: 380 px; Background image: URL (IMG2A); } # Sec- div.rollover a: hover {background-image: url (IMG2b); } & Lt; / Style & gt; & Lt; Div class = "rollover" & gt; & Lt; / A & gt; & Lt; Td style = "width: 220px; height: 380px;" & Gt; & Lt; Style type = "text / css" & gt; # Third-div.rollover a {display: block; Width: 225px; Height: 380 px; Background image: URL (IMG3A); } # Third-div.rollover a: hover {background-image: url (IMG3b); } & Lt; / Style & gt; & Lt; Div class = "rollover" & gt; & Lt; / A & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Tbody & gt; & Lt; / Table & gt; & Lt; Div class = "rollover" id = "first-divine" & gt; & Lt; A href = "link1" & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt; Div class = "rollover" id = "second-divine" & gt; & Lt; A href = "link2" & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt; Div class = "rollover" id = "third-divine" & gt; & Lt; A href = "link3" & gt; & Lt; / A & gt; & Lt; / Div & gt;  

This is a good practice to separate your CSS in a separate file. If you have to use inline CSS (which you do not actually do), then make sure that it is & lt; Head & gt; Insert inside the tag in one place.

There are many errors in your markup (some are listed below). I have cleared your code and have given you an example of working in this JSFDial:

  • You are closing tags that have never been opened ( & lt
  • / Li>
  • Code> Tags with a background image are not inside the table.
  • Cellspacing and cellpadding are not CSS attributes, but HTML attributes - like use them:

Comments

Popular posts from this blog

ios - Adding an SKSpriteNode to SKScene from a child SKSpriteNode -

Matlab transpose a table vector -

c# - Textbox not clickable but editable -