Don't know what I did wrong..

Mr. Blogger · September 3, 2011

Screenshot of my problem: http://i54.tinypic.com/2pzifr7.png

My CSS code so far:

#main
{
background: #A6D7EE;
border: 1px solid #92CFEB;
border-radius: 2px;
width: 46.1%;
margin-top: 35px;
float: left;
left: 27.5%;
position: relative;
}

#main .post
{
background: #F4F8FA;
padding: 2px;
text-align: left;
}

#topic
{
background: #A6D7EE;
border: 1px solid #92CFEB;
border-radius: 2px;
width: 46.1%;
margin-top: 5px;
float: left;
left: -18.7%;
position: relative;
}


#topic .discussion
{
background: #F4F8FA;
padding: 4px;
text-align: left;
}

#topic .user
{
magin-top: 2px;
padding: 2px;
}

What am I doing wrong? The comments are hovering over the entire submit box...

cssfreakie · September 3, 2011

Although you did not define what your actual problem was. My best guess is that you want the captcha to be displayed in front of that table.

In that case, you need to play around with the z-index. I say play around, because with the code you provided us we can't do crap.

Either show a link to an online example. Or the relevant html + css or have a google for css and z-index how to...

Mr. Blogger · September 3, 2011

Although you did not define what your actual problem was. My best guess is that you want the captcha to be displayed in front of that table.

In that case, you need to play around with the z-index. I say play around, because with the code you provided us we can't do crap.

Either show a link to an online example. Or the relevant html + css or have a google for css and z-index how to...

Well I did say in my first post. It is my comments are hovering over my entire comment box. It is the comments not the recaptcha or anything.. Behind the 'test' comments in it is the comment fill out box. The comments should be below that entire thing not in front of it.

cssfreakie · September 3, 2011

Although you did not define what your actual problem was. My best guess is that you want the captcha to be displayed in front of that table.

In that case, you need to play around with the z-index. I say play around, because with the code you provided us we can't do crap.

Either show a link to an online example. Or the relevant html + css or have a google for css and z-index how to...

Well I did say in my first post. It is my comments are hovering over my entire comment box. It is the comments not the recaptcha or anything.. Behind the 'test' comments in it is the comment fill out box. The comments should be below that entire thing not in front of it.

your right you did say comments above, other stuff. Missed that one in the hurry. Anyway the answer is exactly the same.

We need HTML + css to help. The reason for this is because css without html is useless. Got an online example so we can have a look ??

Mr. Blogger · September 3, 2011

Alright here is the html part. I had to get the html parts inside my php aswell. So if you notice any ' or " that is part of the PHP I probably missed to remove.

<div id="navigation">
		<a href="index.html">Home</a> •
		<a href="comments.html">Comments</a> •
		<a href="contact.html">Contact</a> •
		<a href="poll.html">Poll</a> •
		<a href="copyright.html">Copyright</a>
</div>
	<div id="main">
		<h3>Welcome to my Project!</h3>
	<div class="post">
		<form method="post">
		<table>
			<tr>
				<td><input id="text" size="25" name="user" value="Username.."> 
				</td>
			</tr>
			<tr>
				<td><input id="text" size="25" name="message" value="Message..">
				</td>
			</tr>
			<tr>
				<td> <script type="text/javascript">
					var RecaptchaOptions = {
    					theme : 'white'
							};
					</script>	

				</td>
			</tr>
			<tr>
				<td><input type="submit" value="Submit Comment"></td>
			</tr>
		</table>
	</form>
				</div>
		<div class="copyright">Copyright to <a href="http://myblogger.co/project">Mr. Blogger</a></div>
		</div>
<div id="topic">
   <div class="topic">
<div class="user"> 
   </div> 
</div>  
<div class="discussion">  
</div>
</div>

cssfreakie · September 3, 2011

This may sound obvious, but the reason I asked for your relevant html is to be able to replicate what you have in order to solve it.

The code you provided again does not do that. Anyway I found a link that helped me out:

http://myblogger.co/project/comments.html (next time just give that, saves use some minutes wasted).

If I view that in chrome ff and IE I see no problem. What I do see is that you are missing a doctype. PLease have a look at the sticky of this forum, and see why you need that. ALso make sure you validate your css, there are some spelling errors in there.

Mr. Blogger · September 3, 2011

This may sound obvious, but the reason I asked for your relevant html is to be able to replicate what you have in order to solve it.

The code you provided again does not do that. Anyway I found a link that helped me out:

http://myblogger.co/project/comments.html (next time just give that, saves use some minutes wasted).

If I view that in chrome ff and IE I see no problem. What I do see is that you are missing a doctype. PLease have a look at the sticky of this forum, and see why you need that. ALso make sure you validate your css, there are some spelling errors in there.

Hmm just to let you know I am redesigning that look.. The current theme on the link you found off my project site is old, and the screenshot both are different. I have corrected the spelling errors, etc. On the new design. I do have doctype on the new design.

Which the codes I given you in the previous post is from the new design.

cssfreakie · September 3, 2011

Look, i am going to say this 1 more time. your code is not sufficient to replicate the problem you have...

To make it work to a certain degree i added a body and html tag like below. But that still is not sufficient since i do not have any comments or any other relevant stuff to recreate it. So again that is why we need relevant code or even better a link. And don;t hide behind what you now have is better or has a doctype. You post your stuff here, that is what we use we are no visionaries. We just want to help, but if you don't provide the very basics we can't help.

this is all i could do with what you gave, run that, see .... no captcha no replication of your problem.

<!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
#main
{
background: #A6D7EE;
border: 1px solid #92CFEB;
border-radius: 2px;
width: 46.1%;
margin-top: 35px;
float: left;
left: 27.5%;
position: relative;
}

#main .post
{
background: #F4F8FA;
padding: 2px;
text-align: left;
}

#topic
{
background: #A6D7EE;
border: 1px solid #92CFEB;
border-radius: 2px;
width: 46.1%;
margin-top: 5px;
float: left;
left: -18.7%;
position: relative;
}


#topic .discussion
{
background: #F4F8FA;
padding: 4px;
text-align: left;
}

#topic .user
{
margin-top: 2px; /* spelling error magin instead of margin*/
padding: 2px;
}
</style>
</head>
<body>
<div id="navigation">
		<a href="index.html">Home</a> •
		<a href="comments.html">Comments</a> •
		<a href="contact.html">Contact</a> •
		<a href="poll.html">Poll</a> •
		<a href="copyright.html">Copyright</a>
</div>
	<div id="main">
		<h3>Welcome to my Project!</h3>
	<div class="post">
		<form action="" method="post">
		<table>
			<tr>
				<td><input id="text" size="25" name="user" value="Username.." />
				</td>
			</tr>
			<tr>
				<td><input id="text" size="25" name="message" value="Message.." />
				</td>
			</tr>
			<tr>
				<td> <script type="text/javascript">
					var RecaptchaOptions = {
    					theme : 'white'
							};
					</script>

				</td>
			</tr>
			<tr>
				<td><input type="submit" value="Submit Comment" /></td>
			</tr>
		</table>
	</form>
				</div>
		<div class="copyright">Copyright to <a href="http://myblogger.co/project">Mr. Blogger</a></div>
		</div>
<div id="topic">
   <div class="topic">
<div class="user">
   </div>
</div>
<div class="discussion">
</div>
</div>
</body>
</html>

Mr. Blogger · September 3, 2011

Edit: Actually I made a mistake asking for support here actually thinking I was going to get help you're judging my new design based on the link that was in my new design from my old design. So you're thinking my problem is with my OLD design. When i'm talking about my NEW design. So i'll actually ask for support some where else.

cssfreakie · September 3, 2011

Edit: Actually I made a mistake asking for support here actually thinking I was going to get help you're judging my new design based on the link that was in my new design from my old design. So you're thinking my problem is with my OLD design. When i'm talking about my NEW design. So i'll actually ask for support some where else.

You just don't get it do you... I certainly hope there are some visionaries out there that are able to help you.

Just read this post in a few months and try to replicate the problem with the code you gave. If you succed in that i'll eat my 24" flatscreen for breakfast

Mr. Blogger · September 3, 2011

Edit: Actually I made a mistake asking for support here actually thinking I was going to get help you're judging my new design based on the link that was in my new design from my old design. So you're thinking my problem is with my OLD design. When i'm talking about my NEW design. So i'll actually ask for support some where else.

You just don't get it do you... I certainly hope there are some visionaries out there that are able to help you.

Just read this post in a few months and try to replicate the problem with the code you gave.

By the way the code you posted. If you added comments to it (like shown in the screenshot in the first post) it still duplicates that problem. So it isn't hard to tell you been spamming, and trolling this entire thread just to make fun of me. I reported you to a moderator.

Pikachu2000 · September 3, 2011

He asked for the html and CSS code, and you posted a stripped out, edited version of it. How can you expect anyone to actually help you if you won't provide the actual code? That's like asking a mechanic to fix your car without giving him access to it.

Mr. Blogger · September 3, 2011

He asked for the html and CSS code, and you posted a stripped out, edited version of it. How can you expect anyone to actually help you if you won't provide the actual code? That's like asking a mechanic to fix your car without giving him access to it.

The rest of the code is PHP. This section is for css.. If I gave him my php for my comments page I would need to give him my database, and all the php codes that goes to it. I did give him all the html/css. Also from how your post is I need to give him the PHP codes aswell? Well to be honest I don't need help with the php part. I need help with the css part to what is shown in the first post (screenshot) not the PHP.

Pikachu2000 · September 3, 2011

No, in fact its better not to include any of the server side code for problems like this. The best way is a link to the site that's exhibiting the problem. Another good way is to copy and paste the page source by displaying it via View ---> Source.

Mr. Blogger · September 3, 2011

Alright then all he had to do was ask for the view source. But then again I did give him all of the html/css..

<!DOCTYPE html>

<html>

<head>

<link href="style.css" rel="stylesheet" type="text/css">

<meta charset="ISO-8859-1">

<title>Home</title>

</head>

<body>

<div id="navigation">

		<a href="index.html">Home</a> •

		<a href="comments.html">Comments</a> •

		<a href="contact.html">Contact</a> •

		<a href="poll.html">Poll</a> •

		<a href="copyright.html">Copyright</a>

</div>

	<div id="main">

		<h3>Welcome to my Project!</h3>

	<div class="post">



			<form method="post">

		<table>

			<tr>

				<td><input id="text" size="25" name="user" value="Username.."> 

				</td>

			</tr>

			<tr>

				<td><input id="text" size="25" name="message" value="Message..">

				</td>

			</tr>

			<tr>

				<td> <script type="text/javascript">

					var RecaptchaOptions = {

    					theme : 'white'

							};

					</script>	

					<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LdRcMcSAAAAAJLoBl6crSMm5IpIiIbguH07dCe1"></script>



<noscript>

  		<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LdRcMcSAAAAAJLoBl6crSMm5IpIiIbguH07dCe1" height="300" width="500" frameborder="0"></iframe><br/>

  		<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>

  		<input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>

</noscript>					</td>

			</tr>

			<tr>

				<td><input type="submit" value="Submit Comment"></td>

			</tr>

		</table>

	</form>

				</div>

		<div class="copyright">Copyright to <a href="http://myblogger.co/project">Mr. Blogger</a></div>

		</div>

			<div id="topic"><div class="topic"> <div class="user">test </div> </div> <div class="discussion"> test.. </div></div><div id="topic"><div class="topic"> <div class="user">test.. </div> </div> <div class="discussion"> test.. </div></div><div id="topic"><div class="topic"> <div class="user">test </div> </div> <div class="discussion"> test </div></div><div id="topic"><div class="topic"> <div class="user">test </div> </div> <div class="discussion"> test.. </div></div><div id="topic"><div class="topic"> <div class="user">Test </div> </div> <div class="discussion"> test.. </div></div>1<a href='/theme/comments.php?page=2'>2</a><a href='/theme/comments.php?page=2' title="Next Page" rel='next'>></a><a href='/theme/comments.php?page=2' title="Last Page" rel='next'>>></a> 

</body>

</html>

cssfreakie · September 4, 2011

Alright then all he had to do was ask for the view source. But then again I did give him all of the html/css..

Mr. blogger,

I am not sure what you're thinking but at least i hope you are. Your concept of receiving help is a bit odd. You should provide the code, not us. We should not even have to ask for it.. And if we do (4 times) it says enough) Why..? because it makes sense if you think about it, and since it makes sense you can even read it in the forum guidelines (just in case). In a nutshell (for the 4th time): We must be able to recreate the problem don't we?? If we can't recreate it, we can't help, unless we have special powers which i don't.

As for you interesting statement that you gave all the code. No, You didn't!! Don't believe me, compare them and hopefully you see it directly! if not change careers. Want to report me again? I can't be arsed

Mr. Blogger · September 4, 2011

I fixed it myself finally, and thanks for everyone who tried to help.

gizmola · September 4, 2011

I fixed it myself finally, and thanks for everyone who tried to help.

Mr. Blogger: I don't know what your problem is, but cssfreakie is one of the most helpful and knowledgeable css/html developers we have in this community. Your comments and reaction to his attempts to help you in this thread were ridiculous, and then you actually wasted even more resources by reporting him for doing so. Please do us a favor and don't bother coming back anymore, unless you can adjust your attitude.

Sign In

Don't know what I did wrong..

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information