|
HTML - Left Menu
Good day ,
I want to create a menu in my div block but the menu will be like this Categorie <-- this is the title Plastic <-- this is 3 categorie hard <-- type of plastic soft wood metal my problem is that I would like that when you click on a categorie the type would appear and the other categories would go down to give some room for the type. I tryed to use a menu builder from coffecup but it wont put under like I would like. Can someone help me please . thanks in Advance Marc Similar TutorialsI am new to CSS and trying to crate a page with HTML/CSS. I want to display menu on left side and when user click on the menu item -> right side content should be displayed along with the Menu on the left side. Below is the sample code(this code may not be appropriate). Please suggest me how to make this code work correctly. HTML Code: <html>
<head>
<link rel="stylesheet" type="text/css" href="my.css" />
</head>
<body>
<div id="left-menu">
<a href="#" class="current">Hello</a>
<a href="C:\xxx.html">Section 1</a>
<a href="#">Section 2</a>
<a href="#">Section 3</a>
<a href="#">Section 4</a>
<a href="#">Section 5</a>
<a href="#">Section 6</a>
<a href="#">Section 7</a>
</div>
</body>
</html>
my.css file
---------------
#container {
padding: 0;
margin: 0;
background-image: url(container.png);
background-repeat: repeat-y;
background-position: top left;
}
#left-menu {
position: absolute;
top: 220px;
left: 0;
width: 160px;
height: 100%;
border-top: 1px #9ad815 solid;
border-bottom: 1px #9ad815 solid;
}
Thanks! Hello, I am a newbie to html but am working on a company website. I am looking for help with the drop down nav bar. I want to have the bar justified underneath the part that you are hovering over (for example, when you hover over Douglas Cardinal, the words biography, philosophy, etc would be justified underneath. When you click portfolio, current projects, museums, etc would be justified under portfolio) http://www.djcarchitect.com/portfoli...tprojects.html Is this possible? Thanks!! I am trying to get rid of the "You have to click to activate this function" mumbo jumbo for a site I am doing. I tried following these directions... http://www.adobe.com/devnet/activeco...devletter.html but am having a rough time getting it to work... here is my code. Code: <script type="text/javascript"> AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','900','height','140','src','GoodDock','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','GoodDock' ); //end AC code </script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="140"> <param name="movie" value="images/GoodDock.swf" /> <param name="quality" value="high" /> <embed src="images/GoodDock.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="140"></embed> </object></noscript> I want to add a left vertical sub navigation... but i want it to look similar to this one! RamVideos I dont know where to start... Thanks In Advance! Hi , I have an odd HTML question. In my company we make procedures (stuff that we think we need written down in case we need to repeat it), which we update on a regular basis. Whenever we go to do an install, update, fix, etc. and we need a procedure, we print it out and then head off with it (we make red lines as necessary.) All of these are in HTML and stored in CVS. One of the engineers (she is not terribly familiar with HTML and turned to me) asked me if I could make a little "box" to the left of a list. The steps of the procedure are a bunch of <li> tags, having a nice box to the left to check it off as you go through them would be great. This stumped me. The best that I could do was make a one-celled table inside the <li> tags (the HTML for which I've posted) in order to get the impression of a "box" where you can check off a step that you just completed. Is there any way to put that box on the left? If you look at the end of this post I made a simple ASCII representation of what I would like to accomplish. Code: <html>
<head>
<title>
Example
</title>
</head>
<body>
<ol>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
<ol type="a">
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do sub-step...
</li>
</ol>
</li>
<li>
<table border="1">
<tr>
<td>
</td>
</tr>
</table>
Do stuff...
</li>
</ol>
</body>
</html>
Code: +---+
| | 1) Do stuff...
+---+
+---+
| | 2) Do stuff...
+---+
+---+
| | a) Sub-step...
+---+
+---+
| | b) Sub-step...
+---+
+---+
| | c) Sub-setp...
+---+
+---+
| | 3) Do stuff...
+---+
In html left to right <marquie behaviour but i want right to left the text comes from right to left and left standard positin whch command do i need to use? please provide thanks for helping people are telling me that have to horizon scroll (left to right) to see this page: http://www.girlsincsoaz.org I tried it on different machines, including a laptop and I don't have to, what can be the problem? TIA Hello. I have text at the top right, "A Site for All Nations to Share their Knowledge!" and I need to move it to the left a bit so its not overlapping the sun image. I appreciate You! hello the original website is 'http://www.buddysauctions.com/ and when u scroll down you can see that the "Member Login" box is on the left. I wanna move it to the right like me photoshop print screen i know that i have to cut the php code from my php file and create a new php file and put it in but i dont know how to put it exactly where my printscreen shows. thanks a lot for your interest i hope you can help me ) thanks again edit: i also would like to have some empty boxed under the member login so i can put adverts in them edit2: my member login box as you can see in the printscreen PHP Code: <tr> <td><FORM name=loginForm action="login.php" method=post> <div align="center"></div> <table width="262" border=0 align=center cellpadding=5 cellspacing=0> <tbody> <tr valign=center> <?php if(!isset($_SESSION["userid"])) { ?> <td colspan="2" background="http://www.overclock.net/images/bgyell2.gif" class="sideheadingtd" ><strong><img src="http://www.overclock.net/images/squareswhite.gif" width="10" height="12" align="absmiddle"> <font size="2" face="Arial, Helvetica, sans-serif" font color="#ffffff">Member Login</font></strong></td> </tr> <tr valign=center> <td bgcolor="#f5f5f5"> <div align=right><font color="#000000" size="1"><strong><font face="Verdana, Arial, Helvetica, sans-serif">Username</font></strong></font></div></td> <td width="97" bgcolor="#f5f5f5"><font color="#000000"> <input name=UserName class="box1" size="13"> </font></td> </tr> <tr valign=center> <td bgcolor="#f5f5f5"> <div align=right><font color="#000000" size="1"><strong><font face="Verdana, Arial, Helvetica, sans-serif">Password</font></strong></font></div></td> <td bgcolor="#f5f5f5"><font color="#000000"> <input name=Password type=password class="box1" size="13"> </font></td> </tr> <tr align=right> <td colspan=2 bgcolor="#f5f5f5"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="67%"><p class="style2"><a class="insidelink" href="signup.php">:: Signup Now::</a><br> <a class="insidelink" href="lostpassword.php">:: Lost Password ::</a></p></td> <td width="33%"> <div align="left"> <font color="#000000"> <input type="submit" name="Submit" value="Sign In" class="btn"> </font></div></td> </tr> </table></td> <?php }?> </tr> <tr align=right> <td colspan=2> </td> </tr> </tbody> </table> <div align="center"></div> </FORM></td> </tr> I'm wondering how I would fill in the left and right side of the body. Right now it's centered at 800px so I have the left and right side just white. *--><body> <div id="page" align="center"> <div id="content" style="width:800px"> I'm not sure what else you'd need to see, so please let me know. For example this news site: www.kstp.com I'm wondering how I would get the blue sides like this site has. Thanks in advance My webmaster is on vacation and I am trying to post a News Release on our website. This is a very basis question: The copy on this page is centered, and I want to align it left. Here's the page: http://www.247-direct-mail-services.com/news/ Seems to me, this is the style sheet html for this page: <p style="font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold; text-align:left; color:#ffffff;"> But it's not showing this font nor aligning left. I don't know how to fix this. Hoping to get input. Thx. Not sure if this is strictly a HTML problem or not >.< this is my site http://www.melbourneparkour.com.au/ as you can see the hyperlinks in the news and announcements section all align to the left and mess up the formatting of the site, the sentences just don't make sense. OTHER INFO. i use a wordpress blog to actually write the posts http://www.backend.melbourneparkour.com.au/ then i use a bit of php to call that info into the website <?php require_once('../brisbaneparkour_sub/backend/wp-blog-header.php'); query_posts('&showposts= 15&order=DESC'); while (have_posts()) : the_post(); ?> <h2><?php the_title(); ?></h2> <p><?php the_content(); ?></p> <?php endwhile; ?> not sure if that effects it. The confusing bit is that i do exactly the same here www.brisbaneparkour.com.au and there are no problems. same code, css, html, php etc, but different results. apologies if this is in the wrong place, im not sure exactly what is causing it. Hi. i Nead help here i try get adsence on left side of the site. i have try driffent codes but it wont change from right side to left. Code: <div style="text-align:left"><script type="text/javascript"><!-- google_ad_client = "pub-6922170130422170"; /* 300x250, skapad 2011-02-07 */ google_ad_slot = "0334614029"; google_ad_width = 300; google_ad_height = 250; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div>';} Any one can tell me what am doing wroung and how i get it on left side? After some good help from Horus_Kol i made a panel to the left on my website: But now i created alot of stuff on my website, and then i found that something was wrong if there is too much text on the page (sorry, i can't explain it so good ): here is the HTML Code: Code: <html> <head> <title>Urne's Website - About</title> <link rel="stylesheet" type="text/css" href="style/style2.css"> <div id="container" style="width:100%;"> <div id="header"> </div> <div id="left" style="width:30%;float:left;"> <a href="index.html"><img alt="Home2 (15K)" src="img/Home2.png" height="50" width="200" border= "0px"/></a> <p><a href="Community.html"><img alt="Community (15K)" src="img/Community.png" height="50" width="200" border= "0px"/></a></p> <p><a href="Tracks.html"><img alt="Tracks (17K)" src="img/Tracks.png" height="50" width="200" border= "0px"/></a></p> <p><a href="Videos.html"><img alt="Videos (15K)" src="img/Videos.png" height="50" width="200" border= "0px"/></a></p> <p><a href="Images.html"><img alt="Images (15K)" src="img/Images.png" height="50" width="200" border= "0px"/></a></p> <p><a href="Other.html"><img alt="Other (13K)" src="img/Other.png" height="50" width="200" border= "0px"/></a><p/> <p><a href="Trackup.html"><img alt="Track Updates" src="img/trackup.png" height="50" width="200" border= "0px"/></a><p> <p><a href="Settings.html"><img alt="Settings (13K)" src="img/Settings.png" height="50" width="200" border= "0px"/></a></p> <p><a href="Search.html"><img alt="Search (14K)" src="img/Search.png" height="50" width="200" border= "0px"/></a><p> <p><a href="About.html"><img alt="About (12K)" src="img/About.png" height="50" width="200" border= "0px"/></a></p> </div> </head> <body> <div id="main" style="width:70%;"> <h1>Other Things</h1> </div> </body> <div id="footer"> <img alt="Pretty Plant" src="img/Pretty+Plant.png" height="200" width="200" align="right" border= "0px"/> <p><b><u><h3>Pretty Plant 3D Model</h3></u></b></p> <p>This plant i made in September, and was made for this website. You can use it if you want to your track, or any other thing, but if you want to upload it to your website, then please contact me on my e-mail (look in the readme.txt that comes with the plant). <br>Convert the plant to any other format if you want, but please keep the readme.txt unmodified, and safe.</br> <p><a href="dload/Pretty+Plant.zip"><img alt="Download Pretty+Plant.zip" src="img/Download.png" height="50" width="200" border= "0px"/></a> <hr /> <img alt="Urne's World infodocument" src="img/No+pic.png" height="200" width="200" align="right" border= "0px"/> <p><b><u><h3>Urne's World Infodocument</h3></u></b></p> <p>The "Uworld" Project is still going around, and in the beginning i was planning alot, about how the track should be etc. <br>The infodocument contains pictures, and track information about the 5 tracks Urne's World include. Urne's World should be aviable for Download in October/November 2008.</br> Enjoy the reading! </p> <p><a href="dload/UW+Project.doc"><img alt="Download UWorld Project.doc" src="img/Download.png" height="50" width="200" border= "0px"/></a> <hr /> <img alt="Bone Island Light Pack" src="img/No+pic.png" height="200" width="200" align="right" border= "0px"/> <p><b><u><h3>Bone Island Light Pack</h3></u></b></p> <p>Alot of people uses wrong Brightness & Contrast settings wich will cause alot of darkness in Bone Island, so i made this ligth pack to help all thoose who cant drive this amazing track because it's too dark. <br>Hope it helps!</br></p> <p><a href="http://www.mediafire.com/?xvy1gjwxll1"><img alt="FC" align="right" src="img/FC.png" height="50" width="200" border= "0px"/></a> <a href="ihttp://www.mediafire.com/?v2ygm4n7cpu.ico"><img align="right" alt="Extreme" src="img/Extreme.png" height="50" width="200" border= "0px"/></a></p> <hr /> <img alt="Other Pisa Grandprix GFX" src="img/new+pisa.png" height="200" width="200" align="right" border= "0px"/> <p><b><u><h3>Other Pisa Grandprix GFX</h3></u></b></p> <p>Before me & Crone made the update pack for Pisa Grandprix, Crone took this nice picture, to use as GFX for Pisa Grandprix. Please feel free to download, if you like this one better than the 2 other images!</p> <p><a href="img/new+pisa.png"><img alt="Full Size" src="img/FS.png" align="right" height="50" width="200" border= "0px"/></a> </div> </div> Is there any way to make this work so everything is aligned the way that the other text are? Hello! How can I center the divs and keep this arrangement? I have the bg centered and would like the divs to be also, without using the margin-left tag since it will only look centered on some screens. Thank you very much for your assistance! www.rkgrant.co.cc Reference: http://test6.waltonstreetwebdesign.com/ So right there on the home page, "A Warm Welcome" is in an h1 tag, most of the regular text is inside <p> tags except for the test text. Why in the world is the right align of the <p> tags a little to the left of the text not inside the <p> tag and the <h1> tag? The layout of my page, like that of many pages, consists of a bunch of divs inside divs. Whenever I specify the width or height of a div, there appears a space to its left, three pixels wide. This gap also appears when I substitute a standard image (img) for a div. Some of these divs are floated left; others are not. In the latter case, floating left actually gets rid of the space, but causes other problems as I don't really want those ones floated left. Setting the borders, margins, or padding to zero (or a negative number) does not affect the 3px gap. I am using IE7. Please help anyone... even though they appear normally aligned and centered from inside DW all my table are aligned left when previewed in a Firefox. It's all good in IE. Have spent half of a day trying to figure it out <table width="527" height="2180" border="1" align="center"> <tr> <td><span class="style23">xxxxx</span></td> </tr> </table> I doubt that this means much but here is one of the tables. If it means something, this started to happen when I had to put a whole book online for one of my customers that had problems downloading it. So, in the process I copy/pasted from Word to DW. I had to do it. I know that these kind of things can sc... everything up so I made sure that I first cleared all the formatting from Word. So, I'm in a pickle now... Okay I know IE 7 problems are nothing new but being that I am fairly new at this and I am reading everything I can and I am still not catching up with how to correct it. I have the website up on a test server at http://www.vsncom.com/sterling I am working on a mac and the site works fine on IE 5.2 for mac and any other browser. However, IE7 causes a huge shift in the whole page to the left. And a few other elements are slightly shifted as well. The bottom nav is up a little higher than it belongs. The three pictures on the left are shifted further right. And that is all that I get shown when I capture the screen from net render and such. (Please look at attached picture to see what IE7 gives me) So, im not sure what else may be going on. If I can get the whole page to come back to the left then I can address the other issues maybe. But does anyone have any ideas how to do this. Please. I appreciate the help. I have been trying to figure this out for a week now and reading everything I can find online and trying anything I can think of so please save me. Matt Hey everyone, this is my first time designing a website and I am having a little trouble with IE8. I have checked the website on every browser I can think of and only on Internet explorer 8 does it decide to shift the entire website to the left. I am not very good at writing code, and I am even worse at reading it for errors. Can anyone look at my code and find out what is making the website all screwy when viewed through internet explorer? www.whatyoushouldbedoingrightnow.com Also, the title bar has a random mirror image that appears.... but again this only happens in IE. |
|||||||