Posts by ko ko

Add 'class' or 'id' for this anchor.

<?php
      if(isset($user) && (isset($pass)) { //whatever u want for this
      echo "<td><a href='www.something.com/file.htm' class='memberlink'>Click</a><td>";
      } else {
      echo "<td>Click</td>";
      }
?>

And you can change in css:

a.memberlink {
           }

Good luck.

Remove single quote from the red color text.

$sql = "SELECT count(*) as count FROM Users WHERE username = '$username' and `password` = '$password'";

POST method can help you.

Write the variable outside from the string. Example:

echo "<a class=\"pglink\" href=\"news.php?p=" . $i . "\">" . $i . "</a>&nbsp;&nbsp";

This may be help you.

Float these images.

img {
        float: left
        }

Notice that float makes browser debug. But it should work.

Try with 'area shap: circle' instead of 'rectangle'. You can find the coordinate with photoshop more exactly.

http://www.free-css.com/free-css-menus/page1.php
Here is free css meus. You can learn easily and download free.

We can't help you without seeing your code. I think you want CSS drop-down menu and it won't work in IE and others fine. What is your IE version? The CSS drop-down can't work with IE 6 and older because can't understand pseudo attribute ":hover", except for anchor 'a:hover'.

Which space did you mean? Maybe space between the browser and your pgae. Give 'margin' and 'padding' to '0' in body.

body {
      margin: 0;
      padding: 0
     }

That is what I understand your question.

Post your codes.

<a href="your_image.jpg" alt="" title="change photo"><img src="your_image.jpg" /></a>

It is what you want.

There is no container for the text 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse velit arcu, interdum in condimentum sit amet, vehicula non orci'.
HTML is mark-up language, means that it can describes with the tag(element) which part of the document.
Example, in the '<h1></h1>' tag, HTML document says browser this is a heading, also like '<p></p>' , it is a paragraph.
You can test with '<p>' tag.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse velit arcu, interdum in condimentum sit amet, vehicula non orci. </p>

That might be valid.
I'm not expert and I can explain a little and it maybe wrong. Sorry for my language skill.

You were wrong forum. Maybe PHP or any programming forum that you should go.

Do you want the two bars at the top and bottom. The second bar was not correctly rendered, and it appeared at the bottom of the first bar. Put the statement 'clear: both' to the 'bar. Here it is

.bar {
	background-color:#840018;
        clear: both;
	height:10px;
	width:100%;
}

Good luck..

'float' needs exact width. The second 'div' has no width. It means that the width is auto. If your resolution is '1024', so the browser width might be '1000px'. The first 'div' is '160px', so the space for the next float element would have '860px'. The content is more than '860px' wide and it force to the new line. You can read here more about float.

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;

	
}
#ao_nav li{
			display:inline;
			margin:0 0 0 12px;
			position:relative;
			float:left;
			text-align:bottom;
			height: 20px;

}

'#ao_nav li {}', this statement overwrite '#ao_nav li#contrast{}', and '#ao_nav li#first'. If you need more than one selectors with same properties, group these selectors:

#ao_nav li#contrast, #ao_nav li#first {
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
/* this is the same because the '#first' and '#contract' are the children of ul container which is under '#ao_nav' div */
#ao_nav ul li{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

Instead of:

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

The 'text-align:bottom' was not right. 'text-align' has three values 'left,right,center'.
The sub menu cannot be show longer because it's parent 'li#first' has '20px' height, and it positioned at '30px' top from it's parent. Replace 'top: 30px' with 'top: 20px' in '#ao_nav li ul' properties. It would be work. Good luck..

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;

	
}
#ao_nav li{
			display:inline;
			margin:0 0 0 12px;
			position:relative;
			float:left;
			text-align:bottom;
			height: 20px;

}

'#ao_nav li {}', this statement overwrite '#ao_nav li#contrast{}', and '#ao_nav li#first'. If you need more than one selectors with same properties, group these selectors:

#ao_nav li#contrast, #ao_nav li#first {
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
/* this is the same because the '#first' and '#contract' are the children of ul container which is under '#ao_nav' div */
#ao_nav ul li{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

Instead of:

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

The 'text-align:bottom' was not right. 'text-align' has three values 'left,right,center'.
The sub menu cannot be show longer because it's parent 'li#first' has '20px' height, and it positioned at '30px' top from it's parent. Replace 'top: 30px' with 'top: 20px' in '#ao_nav li ul' properties. It would be work. Good luck..

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;

	
}
#ao_nav li{
			display:inline;
			margin:0 0 0 12px;
			position:relative;
			float:left;
			text-align:bottom;
			height: 20px;

}

'#ao_nav li {}', this statement overwrite '#ao_nav li#contrast{}', and '#ao_nav li#first'. If you need more than one selectors with same properties, group these selectors:

#ao_nav li#contrast, #ao_nav li#first {
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
/* this is the same because the '#first' and '#contract' are the children of ul container which is under '#ao_nav' div */
#ao_nav ul li{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

Instead of:

#ao_nav li#first{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;
}
#ao_nav li#contrast{
			display:inline;
			margin:3px 0 0 10px;
			position:relative;
			float:left;			
			height: 20px;
			color: white;
		    font-size: 9pt;
		    font-weight:bold;	
}

The 'text-align:bottom' was not right. 'text-align' has three values 'left,right,center'.
The sub menu cannot be show longer because it's parent 'li#first' has '20px' height, and it positioned at '30px' top from it's parent. Replace 'top: 30px' with 'top: 20px' in '#ao_nav li ul' properties. It would be work. Good luck..

Did you want to appear these two divs next to each(line by line)? I thought that because you used 'display:inline' property to both divs. Float can get these effect too. Sorry that I maybe misunderstood your question.

If you want to appear 'header' and 'topmenu' next to each, you can use 'float' to each. 'display:inline' was not good to use.

Check on browser view source. Are the pagination links within DIV. If it right, there is only one solution, for using class with the pagination links. In PHP:

<?php
$total_results =
mysql_fetch_array(mysql_query("SELECT COUNT(*) AS num FROM gallery"));

$total_pages =
ceil($total_results['num'] / $per_page);
if ($page > 1) {
$prev = ($page - 1);
echo "<a href=\"?page=$prev\" class=\"pglink\">&lt;&lt; Previous</a> ";}
for($i = 1; $i <= $total_pages; $i++) {
if ($page == $i) {
echo "$i ";}
 
else {
echo "<a href=\"?page=$i\" class=\"pglink\"> $i</a> ";}}
if ($page < $total_pages) {
$next = ($page + 1);
echo "<a href=\"?page=$next\" class=\"pglink\">Next &gt;&gt;</a>";
?>

In CSS:

#pagination a.pglink {
    background-color: red;
    color: white;
    border: 1px;
    border-color: black;
    padding: 2px;}

It should be work. Good luck..

It may be overwrite by another css statement. Test with this:

#pagination a{
background-color: red ! important;
color: white ! important;
border: 1px ! important;
border-color: black ! important;
padding: 2px ! important;}

Make sure your css path is right.

Overflow control how to display the contents which are flow out of its parent. The contents can flow out from it's parent when the layer was floated or positioned absolute, or negative margins.

Absolute position can overlap another layer with 'absolute' or 'relative'. You can control what the layer is upper or lower with 'z-index' property. Here is some:

HTML:
<div id="layer1">First Layer</div>
<div id="layer2">Second Layer</div>
CSS:
#layer1 {
     background: green;
     left: 0;
     height: 22px;
     position: absolute;
     top: 0;
     width: 200px;
     z-index: 2
     }
#layer2 {
     background: blue;
     height: 22px;
     left: 100px;
     position: absolute;
     top: 0;
     width: 200px;
     z-index: 1
     }

You will see the layer1 is upper and the layer2 is below. The layer is top, when the 'z-index' value is greatest. You can use with 'relative-position' like this way.

Use 'overflow:hidden' property to the div which hold the navigation menus. I check your HTML and the div is 'ExternalMenuBarEHL1'. So, add this to the CSS property of 'ExternalMenuBarEHL1'.

overflow: hidden

It is not what you want, post again clearly. Good luck.

Did you want to appear 'topnav1' at the right side of it's parent 'topnav' DIV? Use float instead of absolute position. Here is example:

#topnav1 {
        float: right;
        margin-right: -em;
        width: -px
                }

This is easiest way to place 'topnav1' div to the right side of it's parent DIV. Good luck..

Less information and we can't help you. Post both HTML and CSS.

Did you validate your HTML? DTD is important for HTML while using with css. You used many absolute position properties. That cause many issues for the browsers. If you want to make a column, you can use 'float', that would help you more than absolute position.

Developers used "h1" tag for main logo and replace text with image, instead of "img" tag. That helps our site ranks increase and search engine friendly. Try this one:
HTML:

<h1 id="logo"><a href="#">Your site name</a></h1>

CSS:

h1#logo {
       background: url('../your_logo.jpg') no-repeat top left; /* this image replace the heading text */
       height: /* your logo image height */;
       width: /* your logo image width */;
       text-indent: -9999em /* remove text from browser view */
       }

Now your heading replace by image. The link is now inline-level and small area to click. Try this:

h1#logo a {
         display: block;
         height: 100%
         }

'absolute position' makes problems for some browsers. Sorry for my language skill. Good luck...

What is your HTML?

Maybe it could be wrong, but test it. Put [position:relative] to your first(main) container DIV.

Float your image, but floating makes overlapping problem. Floating the image would flow out of it's parent and it parent div can't wrap the image correctly. So you need to fix these browser bug. Try this:

.dragon img {
         float: left
         }
.dragon {
         overflow: hidden
        }

Use shorthand property, it help your code clean,readability and searchable.

border-style:ridge; border-color:#00A800; border-width:10px;

Instead of:

border: 10px ridge #00A800

Good luck..

Use auto margin to align center for block-level elements.

table {
        margin: 0 auto;
        width: 90%
          }

Auto margin can only work when the width was set. And you must validate your HTML document. You're designing with table, so you should validate with HTML 4.01. Here is transitional mode:

<!DOCTYPE html PUBLIC "-//W3C DTD HTML 4.01 Transitional//EN" "http:www.w3.org/TR/html4/loose.dtd">

Try this and if you would not get success. please post again.. Good luck .. friend..

Where did you use this background image? DIV or any block elements. Post your HTML codes..

The absolute position element was not DIV, it was span tag inside 'pagemenu' DIV.

<span style="position:absolute; top: 30px; left:570px; background-color: fuchsia;">
<?php include("mainmenu.txt");?></span>

So, it can be related to it's parent DIV 'pagemenu'. If DIV('pagemenu') has the property,(position: relative), the span stay 30px far from the top of DIV('pagemenu'). Try with:

<div id="pagemenu" style="position:relative">
<span style="position:absolute; top: 30px; left:570px; background-color: fuchsia;">
<?php include("mainmenu.txt");?></span>
</div>

Good luck..

I don't know exactly what your problem is. But your code was not valid.

<link></link>
<img></img>
<br></br>
<hr></hr>

From above, they are non-close tags. You must use

<link />
<img />
<br />
<hr />

The input tag has no close tag too. Fix these and validate again. And why did you insert table into the heading tag.
The heading tag was text container, not element container.
You should use DIV.
Fix the above error and try again. If not you success, post here..
Good luck..

Are you sure that is the 1px margin of LI elements? It maybe the padding, or it's parent margin or padding. So you need to try with all margin and padding with 0, include it's parent UL. Example:

ul {
    margin: 0;
    padding: 0
    }
ul li {
   margin: 0;
   padding: 0
    }

It should be show same result in all browser.

Why not try to search with google?

Go there, this will explain complete CSS properties. http://www.eskimo.com/~bloo/indexdot/css/propindex/all.htm

You was not give the x and y position for container. If there is no specify value for x and y position, IE use it default value '0'. So the container would be top left corner of the browser window. You need to give the x and y position for IE. Here is example:

#container {
     position: absolute;
     top: 0;
     left: 50%
     }

Go there, it will explain you better.

The container is absolute position and the margin auto ignore in IE. Remove the "position: absolute" from the container. The style tag should be write after the title tag and meta tags.

Remove absolute property to head, and give it normal flow. If it absolute position, it was out of normal flow and it left no space in it's parent. So, the element after the head(in your code, a text with div) was move to top it was overlap by the head, because the head div was flow first in the document. You can give z-index to control the layer which is upper or below. Otherwise, you want to see the text next to the head div, you can give the top margin to the text container, same with the height of head div,(in your css, the head div was 206px), so the top margin of text container must be at least 206px or higher.
If you want the text appear on the head div, you can give the z-index to the head div, default is 0. In your code, the z-index of the head div was 1, and the text container was not set, and it has default 0. So, the head div was upper of the text container and the text is behind of it. You need to change negative value instead of 0. Like this:

#head {
      z-index: -1000
     }

This is all I understand of your question. Good luck Julia.

Try this:

/* Is it anchor link */
a:hover {
     cursor: pointer
    }
/* else div or span */
div:hover {
    cursor: pointer
    }

Please post your code where the problem found. We have not enough time to check all of your codes. Thanks

It can work without float. But, you need to remove float from it child "li" tag, and give it inline instead of float. The "li" tag was now block level and it parent was inline.
Inline can't contain block level element.
So, the "li" was not under the control of "ol" and "ol" can't render it's child "li" correctly, and the padding ignore to "li".
When you float the "ol", the "ol" move left as far as it can, including it child li, so the "li" was rendered correctly by it parent "ol".
This may be wrong, because I'm not css expert or css guru, you need to ask css guru who has many experiences with css and xhtml.
Thanks and I hope you will be ok.

Put this css property in the main div.

overflow: hidden

Float overlap to its parent and element followed after it. You can add the clear div after the two float divs. Here is example

<div style="clear:both"></div>

Good luck..

Put float property for ol. Example

ol {
     list-style:none;
     margin: 0;
     padding: 0 45px;
     display:inline;
     float: left
}

It should be work.

Put this in your css file or embed in your HTML document.

ol {
       list-style:none;
       margin: 0;
       padding: 0;
       overflow: hidden
    }
ol li {
       display: block;
       float: left;
       height: -px /* how much height your biggest image in the list container, set the same height with the biggest image within the li tags or higher */
       line-height: -px /* same with height */
       list-style: none;
       margin: 0;
       padding: 0
      }
ol li input {
       vertical-align: middle
       }

I'm not sure it can help you because I was not tested it. If you want the element to vertically align, use height and line-height properties. Same values of height and line-height can place the content vertically align in it. And don't forget to validate your HTML document. Good luck friend...

The vertical-align only apply to inline element. You can use inline tags like span instead of div. Here is example:

span {
      vertical-align: top/middle/bottom/baseline/text-top
     }

See here, for more detail.

Put this in your head section of HTML document.

<!--[if lte IE 6]>
img#yourimage {
background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='your_image.png',sizingMethod='crop');
}
<![endif]-->

But, it was not a complete solution. It may cause some hyperlinks dead when you use this image as background under any layers where hyperlinks is on it.

Use inline-block or float. Inline can't help you.
Here is some code.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Tow Divs Next Each Other</title>
<style type="text/css">
div {
	background: #EEE;
	border: 1px solid gray;
	display: inline-block;
	height: 200px;
	width: 300px;
	max-width: 300px ! important;
	white-space: wrap;
	overflow: hidden
	} 
</style>
</head>
<body>
	<div>
		Content in first box.
	</div> 
	<div>
		Content in second box.
	</div>
</body>
</html>

It may help you.