Twitist Forums
HTML CSS / Tumblr Theme Coding Question, please help? - Printable Version

+- Twitist Forums (http://twitist.com)
+-- Forum: Twitter forums (/forum-1.html)
+--- Forum: Twitter Hashtag (/forum-2.html)
+--- Thread: HTML CSS / Tumblr Theme Coding Question, please help? (/thread-111601.html)



HTML CSS / Tumblr Theme Coding Question, please help? - ☀太阳☀ - 03-20-2014 12:19 AM

HTML editing in the <style></style> section:

When one of the DIV Class things are like this:

#picture:hover #left { ... }

What does it mean?

Especially the #left, what does that mean?

Thanks in advance! Smile


- Dragon Moon - 03-20-2014 12:27 AM

A hashtag (#) in front of a word indicates that that is the name of an HTML element's id. The ":hover" means that a hover state for the thing is being selected. This means that whatever is in the brackets ({ }) will only apply to an element with an id of "left" which is inside of an element with the id of "picture", and only when "picture" has the mouse within its area.

If that's not too clear, try taking a look at the HTML and CSS lessons on w3schools.com, htmldog.com, or codecademy.com.


- nora - 03-20-2014 12:35 AM

picture and #left are the names of div classes. Basically, anything that you wrap in the <div class="picture"></div> and <div class="left"></div> will be affected by whatever is defined within { and }.

:hover after a div class means that the CSS within the curly brackets will only take effect when the element wrapped the appropriate div tags is being hovered.


For example, if you have this in the style section:
#text:hover {color:red}

then anything wrapped in the text div tags(<div class="text">BLALALAA</div>) will turn red when you hover your mouse pointer over it. In this case, BLALALAA is the text that would need to be hovered in order to turn red.

Hope that wasn't all too confusing.