|
HTML - Div Layout Help Needed
I'm trying to get a small section of my site to display a certain way with DIVs. I've asked for help on this back on Friday and haven't gotten any replies yet.
So instead I'm just gonna post a pic of a simple DIV layout I'm trying to get done instead of having people go through my code and try to make sense of the mess I made :p Similar TutorialsHi all, I love the design of this forum. I have a very annoying HTML problem and really need help. Would REALLY appreciate it. On some of the pages there's too much space between the table cells. I've tried EVERYTHING and couldn't find the source of the problem. Take it as a challenge and please help... Try this: http://www.canaseed.com/Search.aspx?search=csdc I've attached a gif file that describes the problem. Thank you so much for your help... what am i doing wrong? Quote: <!--DON'T DARE TO REMOVE THIS--> <!--This layout was made by Prodigy with a huge help of </b><a href="http://st.pcaworld.net/"><b>Levus</b></a>.</div> /*these are the main properties of your layout */ body { background-color: #DD0000; background-image: color: #000000; } /*these are the properties of a table cell */ td { border: 0px; vertical-align:top; } /*these are the properties of a link */ A:link { color: #000000; text-decoration: none; font-weight: ; cursor: ; } A:visited { color:#000000; text-decoration: none; font-weight: ; cursor:; } A:hover { color:#000000; text-decoration: underline; font-weight:; cursor:; } /*these are the properties of the banner */ #banner { background-color: #DD0000; text-align:center; height:198px; width:100%x; border:1px solid #000000; } /*these are the properties of the content */ #content { float:left; background-color: #DD0000; width: 70%; height: 100%; color:#000000; } /*these are the properties of the right menu */ #rightmenu { float:right; background-color: #DD0000; width: 15%; height: 100%; color:#000000; border: 0px solid #000000; border-top: 0px solid #000000; } /*these are the properties of the left menu */ #leftmenu { float:left; background-color: #DD0000; width: 15%; height: 100%; color:#000000; border: 0px solid #000000; border-top: 0px solid #000000; } /*these are the properties of a category on a menu */ .catagory { background-color: #DD0000; color: #000000; font-weight: bold; border: 1px solid #000000; } /*these are the properties of a heading (page title) */ .heading { background-color: #FF0000; color: #000000; width: 90%; font-weight: bold; border: 1px solid #000000; } /*these are the properties of the heading on the disclaimer */ .dheading { background-color: #FF0000; color: #000000; width: 71%; font-weight: bold; border-top: 0px solid #000000; border: 1px solid #000000; } /*these are the properties of the disclaimer */ #disclaimer { float:right; background-color: #FF0000; color: #000000; width: 100%; border-top: 1px solid #000000; border: 0px solid #000000; } </style> </head> <body> <!--only edit under here--> <!--this is the banner--> <center><div id="banner"> <center> <img src="http://i4.tinypic.com/63n130g.png"> </center> </div></center> <!--the banner end here--> <!--left menu starts here--> <div id="leftmenu"> <div class="catagory"><center>Layout Changer</center></div> <div class="catagory"><center>Pokemon</center></div> <a href="pokedex.html"><center>Pokedex</center></a> <a href="POTW.html"><center>POTW</center></a> <a href="FanArt.html"><center>Fan Art</center></a> <div class="catagory"><center>Other</CeNtEr></div> <a href="sigs.html"><center>Free Sigs</center></a> <a href="layouts.html"><center>Free Layouts</center></a> <a href="Games.html"><center>Games</center></a> <a href="emulation.html"><center>Emulation</center></a> <a href="affys.html"><center>Affiliation</center></a> <div class="catagory"><center>Current POTW</center></div> <center><b>#248 Tyranitar</b></center> <center><IMG SRC="http://www.pokemonelite2000.com/sprites/dpmfa/dpmfa248.png" ALT="NPOTW"></center> <center><a href="POTW.html"><b>Past POTW</b></a></center> <!--left menu ends here--> </div> <!--page name goes here--> <div id="content"><center><div class="heading">Secret Pokemon Training Other Known As SPT</div></center> <!--page name stops here--> <!--content goes here--><center><b>News</b></center><br><br> <center>5/12/07: Aeroburn, he said hes gonna help but after hes done with some work of his own, so im happy about that. And maybe just maybe we'll be hosted by a network, not saying any spoilers..</center><br><br> <center>5/4/07: Well, i talked to Aeroburn but it didn't help me i guess i got to do it the easy but complicated way. Site will be released soon.</center><br><br> <center>4/28/07: Yea, its saturday. I still havent talked to Aeroburn! But i put a page hit, and uhh...idk</center><br><br> <center>4/25/07: Since im new to html, i need to do somehting (without this i cant do anything on the liks) so im waiting for Aeroburn to go online XD =P</center><br><br> <center>4/24/07: Yea, i havn't been posting on this, idk y though, i didnt give the link to anyone except Havok. lol, but i havnt been posting cuz ive been trying to figure out the misteries against the layout changer, and it's worth it i got it with the help of Aeroburn from PCA/PokeNebula: If u have errors with any layouts just refresh the page, it should be good =D<br><br></center> <center>4/19/07: We're installing New Stuff. Including Layout Changer, Pokedex, POTW, Fan Art, Free Sig/Layouts, Games, Affiliation,PUA: Info, Trades, Battling, Show Off, PCA: Info, Trades, Battling, Show Off, PC: Info, Trades, Battling, Show Off.<br><br></center> <!--content stops here--> </div> <!--right menu starts here--> </div><div id="rightmenu"> <div class="catagory"><center>Affiliates</center></div> <center><a href="affys.html"><b>Apply Here</b></a></center> <div class="catagory"><center>ShoutBox</center></div> <!-- BEGIN CBOX - http://www.cbox.ws --> <center><div align="center" id="cboxdiv"> <iframe frameborder="0" width="160" height="305" src="http://www4.cbox.ws/box/?boxid=3166240&boxtag=5868&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#FFFFFF 1px solid;" id="cboxmain"></iframe><br/> <iframe frameborder="0" width="160" height="75" src="http://www4.cbox.ws/box/?boxid=3166240&boxtag=5868&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#FFFFFF 1px solid;border-top:0px" id="cboxform"></iframe> </div></center> <!-- END CBOX --> <div class="catagory"><center>SPT's Hits</center></div><br> <!-- Start Bravenet.com Service Code --> <center><script language="JavaScript" type="text/javascript" src="http://pub38.bravenet.com/counter/code.php?id=401896&usernum=3260284116&cpv=2"> </script></center> <!-- END DO NOT MODIFY --> <!--right menu ends here--> </div> <!--disclaimer starts here--> <div id="disclaimer"><center><div class="dheading">Copyright Notice:</div> <center><b>Do NOT steal! "Layout Made By Prodigy with a huge help of </b><a href="http://st.pcaworld.net/"><b>Levus</b></a>.</center></div> <!--disclaimer ends here--> <!-- --><script type="text/javascript" src="/i.js"></script></body> </html> Okay, here is a user profile: Click. As you can see, it looks demented. I'd like it to have a similar setup like this. Here is the HTML we have so far. Quote: <table class="tablebasic" cellspacing="0" cellpadding="2"> <tr> <td width="50%"> </td> </tr> </table> <table cellpadding='0' align='center' cellspacing='1' border='0' width="100%" bgcolor="black"> <tr><td class="maintitle" colspan="2"><font style="font-variant: small-caps; font-size: 18px; font-family: georgia;">{$info['name']}</font></td></tr> <tr><td class="titlemedium" width="10%">Interactive</td> <td class="titlemedium" width="15%">OOC Information</td></tr> <tr><td class="row3" width="10%"><a href='{$info['base_url']}act=Search&CODE=getalluser&mid={$info['mid']}'>{ibf.lang.find_posts}</a> <br><a href='{$info['base_url']}act=Msg&CODE=02&MID={$info['mid']}'>{ibf.lang.add_to_contact}</a> </td> <td class="row1" width="10%" valign="top"><!--{CUSTOM.FIELDS}--></td></tr> </table> <td align="justify" class="row1">{$info['avatar']}</td></tr> <td align='left' width='70%' class='row1'>{$info['group_title']}</td> <td class="row3" valign='top'><b>{ibf.lang.pm}</b></td> <td align='left' class='row1'><a href='{$info['base_url']}act=Msg&CODE=4&MID={$info['mid']}'>{ibf.lang.click_here}</a></td> </tr> </table> </td> <td align='center' colspan='2' class='maintitle'>{ibf.lang.info}</td> </tr> <td class="row3" width='30%' valign='top'><b>{ibf.lang.homepage}</b></td> <td align='left' width='70%' class='row1'>{$info['homepage']}</td> </tr> <tr> <td class="row3" valign='top'><b>{ibf.lang.birthday}</b></td> <td align='left' class='row1'>{$info['birthday']}</td> </tr> <tr> <td class="row3" valign='top'><b>{ibf.lang.location}</b></td> <td align='left' class='row1'>{$info['location']}</td> </tr> <tr> <td class="row3" valign='top'><b>{ibf.lang.interests}</b></td> <td align='left' class='row1'>{$info['interests']}</td></tr> Can you guys help me with this? You can edit the HTML and stuff... Hi. I am new to this forum, and new to html/website development, etc. I am trying to get help on how to fix a problem with my website. I run a website for a small non-profit dog and cat rescue. The site was set up by a friend who understands this stuff, and I basically copy and paste coded? templates where I fill in information about the animals, etc. I am trying to fix a problem with embeded youtube videos, but honestly don't really know what the problem is. The website is www.flarescue.org if that helps. On the site, we have embeded youtube videos, along with pictures of each animals. The videos work fine, and the picture thumbnails look fine as well. The problem occurs when you click on the pictures to enlarge them. For some reason, the youtube videos stay in the foreground, and block the pictures. This problem only happens when viewing the website on IE or Chrome. Everything looks fine when viewing on firefox or safari. Any ideas as to what the problem is, or if this forum is where I should be looking for answers? And if so, where should I post my question? Thanks. Dylan Hi - I'm not a developer and need some help with this... I have a basic html page with images and text and I need to add the functionality of when a user clicks a defined button, the whole page flashes white 5 or 6 times - Almost like someone taking a photo and the flash goes off 5 or 6 times - Is this possible and what script would I need to include on the page to make this happen when the user clicks a certain button. Hope I've explained it ok, any help would be much appreciated - Thanks.. Ok I have some files (500) or so that I need to edit and and replace some parts of the code. Is there a program out there that would edit out certain code and delete it on multiple pages with out going through each page individually. Thanks. Okay, you know those HTML pages on the side of your page on some websites? The frame thingys... I forget the name of it, but I would really like it if somebody could write me a little script to make one. Thanks. Frameset is what I think their correct name is... Help needed! I've been given a website and some code from the website. I need to create a website like this one: http://carapprovalnow.com/ I have the code from this site, but need help filling in the blanks!! Any help would be appreciated!! Thanks!!! Hello! I've no idea, how to margin a html page like the attachment.. Can anyone help me, please??? Our web designer has encountered a problem while designing our website www.buzzprinting.co.uk. The problem seems to be when you scroll down the page you are greeted with a mass of blue background. Does anyone know how this problem can be seolved? Many thanks in advanced. Steve I want to write some HTML to display some details on a CV the same as the images I've attached. The code I've written doesn't produce this exactly for me. Can anyone suggest how to remedy it? Code: <table border=0> <tr> <td><b>Name</b></td> <td>John Smith</td> </tr> <tr> <td><b>Address</b></td> <td>5 Main Street<br>Ballinasloe<br>Co.Galway</td> </tr> <tr> <td><b>Date of Birth</b></td> <td>10-05-1985</td> </tr> <tr> <td><b>Telephone</b></td> <td>086 81828384</td> </tr> </table> Code: <h2><a name="work"><i>Work Experience</i></h2> <b>Dunnes Stores</b> <dd>My main Responsiblities inclued:</dd> <ul> <li>Packing</li> <li>Till work</li> <li>Mopping out toilets</li> </ul> Hi guys, I'm making a newsletter template while volunteering for a charity. I'm very much not an expert in html and I'm really stumped as to how I've gotten the code for laying out cells in such a mess. I managed to make a template with a less complex layout but then modified it and this happened: I've highlighted the areas with a red ring where there is grey and there shouldn't be. It was perfectly fine when the newsletter sections were two per row but when I modified the code so that the first section took an entire row it went downhill Where the grey is there aren't actually cells and when I try to put ones in in the correct place, they turn up somewhere unexpected and wreck the whole layout. Can someone please help me? I have uploaded my work he [now deleted] Thank you for any help you can give! Hi, I got this template, ( see picture below) Could someone help me to get rid of the side bar on the left but everything else should be as it is. I've attached the index.html as well as the style.css file. Thank you Hey guys, I'm looking for a script, which I think can be made HTML, that will allow a drag-able side panel. Like a space on the 'left' side of my page that can be typed in (in my case, I'm using it for a nav bar). And the bar dividing the page and the frame is drag-able when it is online, so you can change it's size. If anyone has a script that can be used for this, or can help me make something like this, please respond There is the share option on Metrolyrics to share certain text check it out here http://www.metrolyrics.com/fall-for-...-serenade.html when you hover over the lyrics you see the share button HOW DO I GET THAT? This is NOT a professional website - it's just a crappy blogging portfolio project I have to do at Uni so please ignore the awful photoshopping. Basically I want to know if it's possible to add an iFrame on an image? I have dreamweaver CS5 and cannot for the life of me work out how to do it. My website is: www.chloieonline.com. Basically, if I use the image as a background, I can't work out how to align the frame PLUS it's quite a large background dimension wise. If I insert the image, I then cannot work out how to add the iframe on top on the image?! If anyone can help I'd be so grateful!! Hi Everyone, I am developing website where in client need a google internal search on his site. Since i have converted my html's into php. how should i implement script into my php file. If any one having script please provide the source code. Help would be appreciated. Thanks in advance. This is my blog : www.moneyplanters.com hosted on Blogger platform I need to integrate Yahoo Finance charts (as on http://livecharts.50webs.com/charts.html) and a Gann calculator (as on http://www.gannsquareof9.stockmaniacs.net/ OR http://www.pivottrading.net/pivot/pivot/gann.html) The codes will be easily available to the prgrammers from these respective websites. However, their only job will be to modify it to some extent, as i would like to change the content and add/delete a few features as mentioned below : Gann Calculator : The grid should not be visible. The code should carry out the calculations at the backend and only the results are to be displayed to the user. Background colours, fonts etc will be changed later. This part of the page should not refresh automatically. Yahoo Charts : User should get a dropdown menu to choose his market. Based on his choice, the next dropdown in which he chooses the scrip gets activated. Scrips for markets other than the user's choice are not displayed. Background colours, fonts and position of objects will be changed later. This part of the page should auto - refresh every one minute. Chart size and auto refresh choices to be removed and shall be fixed after consulting the programmer. Others : 1. All code must be "blogger" friendly and shall be hosted on Blogger platform. 2. Scope of adding text should be there, which shall be added from the blog editor. 3. Scope to add modify Adsense ads within the post (which will include the charts and the calculator) should be made available. Can anyone code this for me ?? Hello, Does anyone know the Html code which would place a transparent Gif on top of an actual image, to prevent people from copying it? I got the code below from some where, but it dose not work (or I am not using it correctly) <SPAN STYLE="background-image: url(hemcircuit.gif)"><IMG SRC="transparent.gif" WIDTH="195" HEIGHT="190" BORDER="0"></SPAN> * hemcircuit.gif is the name of the actual image. * transparent.gif is the name of the transparent GIF. * The WIDTH and HEIGHT values (in this example 195 and 190) are the width and height of the actual image. I put my image Url in place of hemcircuit.gif, for example <SPAN STYLE="background-image: url(http://mywebsite.com/myimage.gif)"> But this just does not look right to me, and it doesn't work!! Please help... |
|||||||