williamkeck

okay, i finally did it. Holy Crap!!! I was making such a silly error. i was doing everything around within the page and I needed to change it in the content-page …

Okay. Resolved.

WPyogi, I got the background to change using the first block of the code below, but when I add the second block for arrow and I do a span in the tag, it just doesnt show up… check it out…

.entry-title, .entry-title a {
  background-color: #e3e3e3;
  padding:  10px 40px;
  margin-left: -100px;
  position:relative;
  width:90%;
  font-size:60;
}

.entry-title, .entry-title .arrow {
  width:0;
  height:0;
  line-height:0;
  border-left: 20px solid transparent;
  border-top: 10px solid #c8c8c8;
  top: 100%;
  left:0;
  position:absolute;
}

and in the page…

<h1>The Snapshot <span class="arrow"></span></h1>

You are seriously my hero right now. You have helped me come so far. I shall drink a pint in your honor.

Wow, found such an easy solution. I think that twentyeleven overrides everything. however, if you do it in the theme extensions plugin, it is really easy. wow

thanks so much for your time Wpyogi

Thanks for the SEO tip. Either way, I could do it for any tag type, but want to be able to implement this. To make the class for h1 is this in the style sheet? I feel like I have already done this…

When I do a new page and I am writing in the page (not post), I want to use h1 to divide sections. For example, I want to change the background color on http://parispoc.com/live-page/1st/ where it says Crossing the rich and the poor…

Hey Andrew.

It just does not end up working out the right way. I am going to tinker more with the JQuery stuff. I still have some problems with making my own widget area, but I need to try to figure that out…

Thanks,

William

I copied the theme from twentyeleven and renamed it. I looked into child themes but it did not make much sense to me.

Looking at what you are doing here, there is no #access li li a – rather there is:

#access ul ul {
	-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	display: none;
	float: left;
	margin: 0;
	position: absolute;
	top: 3.333em;
	left: 0;
	width: 400px;
	z-index: 99999
    top: 30px;;
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul ul a {
	background: #BAB5B5;
	border-bottom: 1px dotted #ddd;
	color: #444;
	font-size: 10px;
	font-weight: strong;
	height: auto;
	line-height: 1em;
	padding: 10px 10px;
	width: 168px;
}
#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
	background: #BAB5B5;
}
#access li:hover > a,
#access a:focus {
	background: #f9f9f9; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#f9f9f9, #e5e5e5);
	background: -o-linear-gradient(#f9f9f9, #e5e5e5);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */
	background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
	color: #373737;
}
#access ul li:hover > ul {
	display: block;

I set to 400px and added 30px for top…But not sure for the next part. Will this end up giving me two different columns (and how?)

Thanks a lot for the continued support. Cheers!