Closing the Gap between the Entry Title and a Slideshow
-
I’m SO sorry, Bro! Okay, I want >>all full-width pages<< and also >>all posts<< to share the >>same<< animation.
I know this isn’t correct, but to clarify what I’m trying to accomplish:
body:not(.page-template-full-width-page & .single) #content
Side Note: When I setup the code as body:not(.single) #content to see it’s effect on the posts pages, the animation didn’t take.
-
I’m still confused. The code you give below I would change to this instead.
body:not(.page-template-full-width-page) #content, body:not(.single) #content
would exclude the animation from full width pages and from posts. It would happen everywhere else. -
^It might seem like tedium, but I’m just trying to emphasize the importance of those specific types of pages (product information and its coinciding safety info) as together. It’s a mild variation from the other pages, but I think it will be effective.
-
It didn’t work, but it may be due to the way I’ve set things up. Can you take a look at it, or should I include the code here?
-
Here’s how I have things arranged:
body.home #content !important {
-webkit-animation: fadein ease-in .25s;
-moz-animation: fadein ease-in .25s;
animation: fadein ease-in .25s;
}body:not(.home) #main {
-webkit-animation: fadein ease-in 1s;
-moz-animation: fadein ease-in 1s;
animation: fadein ease-in 1s;
}body:not(.page-template-full-width-page) #content {
-webkit-animation: fadein ease-in .75s;
-moz-animation: fadein ease-in .75s;
animation: fadein ease-in .75s;
} -
First off, remove the !important here
body.home #content !important
The !important keyword is only for the declarations, not for the CSS selectors. -
-
Not sure how I got that in there, but it’s gone. Setting it up as
body:not(.page-template-full-width-page) #content, body:not(.single) #content
…didn’t take, so I just removed the .single parts and put it back to the stack I have above (minus !important). Oh well. It’s cool as is. I can sense the frustration. Don’t sweat it.
-
Too bad I can’t delete my comments. Pardon the botched code on these most accurate forums, Dude.
-
^and…How about that last topic stays last, and I move on? This is a strange phenomenon, but every time the product Extreme Orange is listed on any industry page, or the main “Products” page, it’s blue underline is showing up black; Only in IE. The same thing is happening to the two products under “Green Cleaning”, that show up on the “Products” page (page 2), “Housekeeping & Janitorial” and “Nursing Hoes & Hospice” page only. Again, only in IE. Everything’s fine in other browsers.
-
Couldn’t stop it mid-submit..Not “Nursing Hoes”, but “Nursing HOMES”.
HUGE difference…… o.O
-
Which version of IE and on what version of Windoze? I’ll see if I can reproduce with Browser stack and figure out why.
-
-
-
^Forget that last thing. Just made it consistent, because it looked awesome. Just wondering what’s going on with those black underlines. If it weren’t for some minor glitchyness, IE looks amazing!
-
Let me get the game computer fired up and see if I can figure it out. Most likely it will be something like adding !important to one of the CSS declarations.
-
I don’t have any specific code pointing to those links, other than the hover color. I had !important; on the color line, but not the font weight line. I can’t check to see if that solved it, because IE is messing up like normal, but I will after a reboot.
-
This is in the HTML for the page. On Extreme Orange, you have a span around the link HTML with a text-decoration: underline; style set. On the ones that are blue, you have the text-decoration: underline set in the “a” element (link) so it takes on the color of the text. Here is what is on the Extreme Orange:
<ul> <li style="text-align:left;"><strong><span style="text-decoration:underline;"><a href="http://hudsonchemicals.com/extrm-orange">EXTREME ORANGE</a></span></strong></li> </ul>If I do CSS to fix this, it could well cause issues in other places.
Here is what you should have in the HTML if you want the underline to be blue:
<ul> <li style="text-align:left;"><strong><a style="text-decoration:underline;" href="http://hudsonchemicals.com/extrm-orange">EXTREME ORANGE</a></strong></li> </ul> -
Wow…More inexperience showing through. I’ll make the repairs. Thank you!
This raises a question. Can you make CSS edits, where something repeats on every page or post? If so, my life will be much easier with the mass of products to be added to this structure over time.
- The topic ‘Closing the Gap between the Entry Title and a Slideshow’ is closed to new replies.
WordPress.com Forums 