st89
Members
-
Joined
-
Last visited
Everything posted by st89
-
I've just written the following, hoping it would lead me to a nice series of positioned black boxes as it's done in the past. Unfortunately, all I get are the contents of my div's written out next to each other with a black background (in the latest Firefox). I'd be grateful if any experience eyes could point me to where I've gone wrong. Many thanks FYI I'm going to z-index logo so it appears on top of the header <html> <head> <style ="text/css"> /* CSS SURPRISE KILLER */ html, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, img, ins, kbd, q, s, samp, small, strike, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-family:arial; vertical-align: baselinebaseline; background: transparent; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* LOGO */ div0 { positon:absolute; top:0px; left:0px; width:800px; height:100px; background-color:black; } /* HEADER */ div1 { positon:absolute; top:100px; left:0px; width:800px; height:100px; background-color:black; } /* SEARCH AREA */ div2 { positon:absolute; top:0px; left:800px; width:200px; height:50px; background-color:black; } /* RSS AREA */ div3 { positon:absolute; top:50px; left:800px; width:200px; height:50px; background-color:black; } /* ACCOUNT SNAPSHOT */ div4 { positon:absolute; top:100px; left:800px; width:200px; height:400px; background-color:black; } /* CONTENT */ div5 { positon:absolute; top:125px; left:0px; width:800px; height:400px; background-color:black; } /* MENU BAR */ div6 { positon:absolute; top:100px; left:0px; width:800px; height:25px; background-color:black; } </style> <title>MySite</title> </head> <body> <!-- LOGO --> <div0>Logo</div0> <!-- HEADER --> <div1>Header</div1> <!-- SEARCH AREA --> <div2>Search Area</div2> <!-- RSS AREA --> <div3>RSS Area</div3> <!-- ACCOUNT SNAPSHOT --> <div4>Account Area</div4> <!-- CONTENT --> <div5>Main Content</div5> <!-- MENU BAR --> <div6>Menu Bar</div6> </body> </html>
-
The best things in life are free: Tizag & W3School Tutorials beat all the books I bought/borrowed (for £££'s!!) hands down. Also, there is a wealth of information in the PHP and MySQL manual pages.
-
It's a brilliant tutorial but how would I translate it into a horizontal menu? I tried changing "home" to "menu", "myaccount" etc but it only showed the first menu item and nothing else. Thanks in advance
-
CSS here: div1 { background:blue; color:white; width:100%; height:20px; position:fixed; left:0px; top:0px; } div2 { background:black; color:white; width:100%; height:25px; position:fixed; left:0px; top:20px; } div3 { background-color:black; color:red; width:100%; height:50px; position:fixed; left:0px; top:45px; } div4 { background-color:#b8b8b8; color:red; width:100%; height:auto; position:fixed; left:0px; top:95px; bottom:0px; background-image:url('contentbackgroundfade.png'); background-repeat: repeat-x; background-position:bottom; } div5 { background:gray; position:fixed; width:100%; height:25px; left:0px; bottom:0px; } div6 { background-color:white; color:red; width:auto; height:auto; position:fixed; top:100px; left:5px; right:5px; bottom:30px; }
-
FYI I've been attempting to use a few tutorials I found on Google but they've all ended in the same problem. Basically I want to have a menu row (made up of a series of horizontally aligned 73x25 png's) where each item links: <a href="#" /> Also, I want each image to change when hovered over (basically change to a custom invert of itself) and revert to its original whenever it's not hovered/the link is active/it's been visited (to avoid the purple link visited box around the image). I've tried a series of different tutorials that all work whenever I use just one menu item but won't work when I try 2, 3, 4 or 5 side-by-side. I'm really confused because I did everything right by several tutorials. Ideally I want to refrain from creating a series of separate <div>'s for each menu item and would appreciate it if someone could share their CSS image link hover wisdom Below is the HTML I've written: <html> <head> <link rel="stylesheet" type="text/css" href="index.css" /> <title>Webpage</title> </head> <body> <div1><img src="header.png"/></div1> <div2></div2> <div3></div3> <div4></div4> <div5></div5> <div6></div6> </body> </html> The menu is to go in the 100%x25px <div2> element. Thanks in advance for any help/tips/pointers
-
-
Based on WDF members experience, is it more worthwhile to build an interactive web site/application (with MySQL backend) using PHP for the legwork (calculations, writing to the DB, reading from the DB etc) and using CSS to style the HTML output, OR going Google and using Ajax (on top of MySQL)? The application itself is a stock exchange. It's not for a client/project but to learn new skills prior to uni in September. Although I have no experience of working with JavaScript I am comfortable with HTML/CSS, PHP, MySQL and C (which looks similar in style to JavaScript and PHP). Any tips/pointers/wisdom greatly appreciated