Hyperlinks A HREF do not work - xhtml

I'm a bit fooling around with a new website idea. But when i was testing it the A HREF does not work. It's not even showing a finger/hand pointer.
It's the text at the content area (the first white block under the header, but not the menu). The headers should be links to the posts (Wordpress).
screenshot of the links that do not work (red arrows):
http://new.go80.nl/screenshots/brokenlinksscreen.png
Actually all the links in that area do not work.
And at the Contact page not even the google maps work.
I can't move around and can't click the links.
Can somebody please help me figure this out? I don't want to start over.
Website: http://new.go80.nl/headlines
EDIT, i first linked to the home page. Beacouse I'm new here i could only add one link and the home page actually is OK so I linked to the Headlines page.
Thank you guys very much!
Greetings, Joeri Kosters

It looks like focus is going to the pagewrap div by default
EDIT #2: Make sure you give an example that actually shows the problem : )
It looks like somehow you've gotten z-index: -1 on div#content, so it is falling 'behind' div#pagewrap and so is not clickable. Get rid of that and you should be fine.

There is a z-index: -1 in your global.css in your #content id section. Remove this and your problem is fixed.
The z-index is making all of the #content links unreachable by the mouse.

Umm, you haven't put this text inside <a></a> elements, according to the HTML source.

Umm just put those headlines text in between the "a" and href tags.
Your Heading

Related

Issue with Div inside a div and page going to bottom

I have gone thru the site and searched for the last two hours and am trying to get a wordpress site to work correctly. Everything is working except the white box that holds the content will not go to the bottom no matter what I try. I have tried all the options here but I think it may be that I do not understand enough about css or the divs are all messed up from the template. Can someone please help out with what I have crossed. My page is located at http://craftedimages.com/AA/aae-events/ and you will see the white box on the right that does not extend down. I got this template and have been modifying it of which there were already lots of problems. Thanks for your time ahead of time.
Try adding
#page{
height:1035px;
}
..to the css - the sidebar is this height and although it is auto that is the given height
Hope this helps
Using chrome inspect element. I can see that your <div id="wrapper"></div> has the style
height:auto;
set it to
height:100%;
That should fix it. Only do that for this page. The other pages are set to auto because it forms to their content. This page doesn't have enough content to reach the bottom like the rest of the pages.

CSS positioning issue. Element not Displayed where Called

So, CSS is not my strength. I need some help. I'm developing a Wordpress Plugin, and while I have the PHP down, I need help with getting the CSS to work with me. The page can be seen at http://www.airupt.com/?page_id=386. The issue is that I have called a shortcode for the search box below the call for the search results. This is for demo purposes only and the link will die soon after this is fixed.
Please type something in and search, you will see what I mean. The Search box background will appear at the top of the results, over the first one. The search box itself will appear after the results, as expected.
Can anyone tell me where the code went wrong and how it can be fixed? :D
Are you testing this in more than one browser? It doesn't seem like it. To answer your question:
give it a float:left;, like the rest of the elements in the <div class="entry">
.search-custom {
float:left;
/* all the other styles for search-custom that it normally has*/
}
I'd say rather set clear:both on .search-custom.
overflow:hidden will get you into more/different trouble because your sizes are a bit out
Set overflow:hidden; on your .search-custom div, then go get yourself a copy of Firebug. It'll get you out of 80% of these jams.

how can I make google +1 button hover message be transparent

How can I edit the styling of these part of google +1 button? kinda hard for me to explain the detail in english. so I make this picture
I know it's located inside an iframe, some says that we couldn't edit the styles inside an iframe which sourced from other domain. but apparently, I have successfully styled my facebook like button to be looking good (transparent on the border). And also, I saw some other sites which have a nice looking google +1 button (without those blocking solid white background)
Edit: possible solution:
Looking at the markup and css on the page below it looks like somewhere in your css you must be setting the background-color of the div that the bubble is contained in to white or #fff. Try something like:-
.pls-container {background-color:transparent}
Do you have a link to this page, or a site that has a +1 button which has the same rollover so people can experiment? It would be easier to give a definite solution then...
Edit: just had a look here at the +1 buttons (at the top of the post and in the sidebar at the right) these both appear to be transparent borders - so there must be something different about your page. You could try looking at that page as an example and see where you've gone wrong, but without the code to your page it will be very difficult to give a solution to your problem directly.

Wordpress individual posts display gone wonky

I have a very basic theme that I created and I'm running into a problem that I've never experienced with any other theme I've made.
The homepage, pages and blog category pages display fine. When I click on an individual blog post, though, the post appears at the TOP of the page, UNDER the header and nav bar.
http://s5.mynewsitereview.com/category/blog/ - this is correct
http://s5.mynewsitereview.com/test-post-one/#more-1 - this is not
Please help!
I think the problem is the page is scrolling (oddly, I agree) to your more-1 anchor because you've specified that in your link (after the #).
I think you have two options:
Get rid of the anchor in your link (http://s5.mynewsitereview.com/test-post-one/ looks fine), or
Move (to the top of your post) or remove altogether the anchor (<span id="more-1"></span>)
The problem is because <div id="main-pages">
have style:
overflow: hidden;
EDIT:
There is one easy to implement full height layout with header, footer and columns.

Highlighting two navigation items with <body id>

I've read through the forums and have not been able to find a question similar enough to mine for me to fix my website, so I hope someone can help.
I'm building a website for my local school which has a top navigation and a left side navigation. I've written the top navigation as a list and styled in CSS and use Body ID to highlight the navigation item of the page I'm on, that all works great and I'm going to move that to an include in PHP so I've only got one file to update for that.
On each of the sub categories though, I have a side navigation, which is currently manually programmed and manually highlighted, but I'd like to be able to do the same as the top navigation, have a list navigation and have something like Body ID which automatically highlights the left navigation item when it knows it's on the right page. I've tried adding two Body IDs and this didn't work. Is there a smarter way to do it?
Here's my test site which is work in progress at the moment.
http://www.antbird.net/school/
Thanks very much, I appreciate any help I can get.
Ant
You can only have one ID for each element.
However, you can use that <body id=" "> when setting the left nav.

Resources