HTML - Div Fill Whitespace
Hi everyone,
I've got a div setup, used for navigation, like so: HTML Code: <div class="container"> <div class="item">Home</div> <div class="item">Link 1</div> <div class="item">Link 2</div> <div class="item">Link 3</div> <div class="item">Link 4</div> <div class="item">Link 5</div> <div class="item">Link 6</div> <div class="whitespace">Fill Whitespace</div> </div> The container div is 800px, but the links only come to 700px, roughly. I want to fill the remaining space, because each item has a border, other than the selected one, and i want the border to touch the side of the container. I've tried Code: .whitespace { width: 100% } and this does work partially, but the div finishes just short of the edge of the container. I've entered text into the whitespace container, which has stretched it to the edge of the container, so i know theres nothing getting in the way. Any ideas how i can get the whitespace div to fill up the remaining space in the container div? Thanks Matthew Millar Similar TutorialsHi, just starting out getting to know html, and I am trying to get around whitespace. I wish to create a tab (whitespace) and I cant seem to find the command/code for it. Is there a good page/site that can give me an overview and explanation of html code? thanks in advance Robenson There is whitespace that shows up at the bottom of my web page and I'm not sure how to get rid of it. This happens in Safari and FF, but not IE. See, I have a little menu at the bottom of the page where there's a top border and bottom border to it with a couple graphics I whipped up. Underneath the bottom border there becomes whitespace <> IE. There are no blank characters or carriage returns or anything in the code. Idk... Is there a way to eliminate whitespace between two elements. Here is a really simple example, where I want to eliminate the whitespace between two header elements. <h1> Hello, world </h1> <h2> yo, adrian! </h2> ...real estate is at a premium on the pages I'm working on, and I can't figure out how to get ride of this whitespace. I've tried css, where padding: 0px for the individual elements, as well as css for an encompassing div where padding: 0px but it doesn't work. Am I a nub or what!? I made a flash dropdown menu, but it's creating whitespace that i dont' want. How do I make it so that it just overlaps whatever is under it? frames and tables suck.... but i'm using them anyway. i want to show the menu that's on every page of the site in a frameset with another page. here's the frames page: http://lotpatrol.com/dictionary/index.php how do i get the white space to disappear from around menu.html? i've tried everything i could find on the interweb and still no luck. I'm not sure if this is the correct forum, so please direct me if I'm in the wrong place. I get the following error message when starting my website: Cannot view XML input using XSL style sheet. Please correct the error and then click the Refresh button, or try again later. -------------------------------------------------------------------------------- Whitespace is not allowed at this location. Error processing resource 'file:///C:/Users/aa/Documents/Visual Studio 20... for(loop = 0; loop < images_array.length; loop++) -----------------------^ Here's my code upto this function: <html> <head> <title>Company</title> <script language="javascript"> arImageList = new Array (); arSubImageList = new Array (); function preLoadCatImages(images_array) { for(loop = 0; loop < images_array.length; loop++) { arImageList[loop] = new Image(); arImageList[loop].src = images_array[loop]; } } Look at: http://realcrazyestate.com/ So in FF there always seems to be this little bit of white space below the flash video... and only in FF, I can't figure out why it is there... Any ideas, specifically on how to get rid of it? Thanks! I'm having difficulties with white space in <select> boxes. A simplified example is below; Code: <select> <option>testing (1-2-3)</option> </select> I would like this to appear with the full white space - but instead it trims to 'testing (1-2-3)' in the select box. Anyone any ideas how to make the select box render and return the option including the white space? Hey guys, I have wrote a scrolling news feed that pauses when you mouse over the scrolling elements inside. Here is a simple example of the problem that I'm having: Code: <html> <head> <script type='text/javascript'> function check(id){ alert(id); } </script> <style type='text/css'> div{ position:relative; } </style> </head> <body> <div id='master' style='border:1px solid black; width:60px;' onMouseOut='check(this.id)'> <div id='div1' class='menuDiv'>Div1</div><div id='div2' class='menuDiv'>Div2</div> </div> </body> </html> When you roll your mouse in between the two divs inside the border, you get a onMouseOut event from the master holder div. Is there any way to jam both of those divs together so you don't get that event when you mouse over them?? Thanks for any help!!! Attention all HTML lovers, geeks and essentially anyone who can relieve me of my burden... for you will surely be blessed. Check out this site: equinat-usa.com For whatever the reason, and one clearly above and beyond my HTML ability to see... the page images should be at the very top on both sides. BUT NO!! There is a bit 'o white space at the top. What's up with that? At first, everything was fine... until one day the mysterious white space appeared. DTM *anxiously awaiting your reply* I've created a sample website here and cannot figure out where the whitespace between images is coming from! It doesn't appear in Dreamweaver, but does in both Firefox and IE6. I've tried editing the border, padding and spacing properties of the table, rows and images to no avail. I've also tried to change these properties in CSS with no results. Any ideas? Josh Hi, I'd like to know how to completely fill a web page with an image. This might sound like a simple thing but I would like to have an image fill the web page window 100%, at least top left and right should be possible. When I try this in Dreamweaver by placing the image inside a table there is always a white border around the image, even though I am using the 100% fit attribute. Browsers of importance: IE6/7 I visit a lot of sites where the window is filled exactly. Is it best for the image to be larger than 1024 x 768 or smaller, and if smaller, does the HTML code stretch the image or contents to fit? If I could get past this, I might be able to get interested in web site building, but this has thwarted all my interest if what you create doesn't fit the browser window properly. Thanks in advance! Hi everyone - I've been building our new site located at http://viralms.com for the last few weeks. There is just one thing I can't seem to figure out. On the home page there is a Marketing Evaluation form with "Name" and "Email" fields. When someone is to fill out those 2 fields and hit "Continue" I want it to land on this page: http://viralms.com/analysis.html Upon loading the analysis page, the name and email fields should be automatically filled out. I've seen it done before but can't really figure out how to do it Thanks J Pretty new to HTML and have a few basic sites done, however I would like to attempt to add a fill in box with this same information as is this possible?http://www.newmexico-dodge.com/ou/al...page=c_finance Hi there, I am looking for a way that if a user clicks on a button on my website it will autofill a search field on a website that I have no control over. I have been told that I just need to add the url http://www.externalsite.com?fieldname=123456789 This doesn't seem to work. Can anyone help with this? Hi guys, first thing first, nice to be part of this forum. My first post and question. Suppose i have 5 identical forms with name, address, city, post code, is it possible to do one submission for all rather than doing it one by one... Thanks Hi, I'm having a bit of a problem with my table. A cell which should completely be filled with a picture leaves a small - but - whitespace between the picture and the next cell. I've posted a pic of the problem and here comes the code: <table border="0" cellspacing="0" width="780" align="center"> <tr> <td height="250" width="780" colspan="3"> <img src="pics/Kjolur.png" height="250" width="780"> </td> </tr> </table> <table border="0" cellspacing="0" align="center" style="background-color: white;"> <tr> <td height="750" width="194"> <table border="0" cellspacing="0" cellpadding="0" style="background-color: #f0f0f0; border-left: 4px solid #f0f0f0;"> </tr> <tr> <td class="sub1" height="10" width="190"> </td> </tr> <tr> <td class="sub1" height="27" width="190" style=" border-bottom: 1px solid darkgray;"><a href="http://www.kerlingarfjoll.is/information.html">Information</a> </td> </tr> .... etc. I've quite new to this and find myself a bit at a loss, so any help would be soo much appreciated!! Best, thora I have come accross a problem on my site. If i let the browser (FF in this example) remember my login details, it then places them in some input fields on my account settings page. Only it puts them into the wrong one. Eg, it places the username from the login into the "new_forename" field in the account settings below is the html (minus the divs...etc) for the site login form and then the change forename form on account settings.php. Here is the html code for the username and password entry on my login screen: Code: <form name="login" method="post" action="authenticate.php"> username <input style="width:180px" name="enter_user" type="text"/> <span class="form-warning"></span> password <input style="width:180px" type="password" name="enter_pass"/> <input class="button blue medium" type="submit" name="login" value="login"/> </form> Here is some html code from my account settings page Code: <form name="new_forename" method="post" action="accountDetails.php"> Enter new forename <input type="text" name="new_forename" value="" size="30"/><br/> Enter your password <input type="password" name="password" size="30"/> <input class="button blue medium" style="width:130px" type="submit" name="save_forename" value="Save new forename"/> <input class="button red medium" type="submit" name="cancel" value="Cancel"/> </form> How can i correct this? Is it that the browser is seeing the "password" fields and simply filling in the stored password field with the password saved for the site? How do I prefill an input field in a form? I don't mean "value=hello" I mean have a light gray text inside that says "enter your first name" and then when the user starts typing that text disappears. I thought there was an html tag that did this (or a form tag like type=""). I hope it doesn't require CSS... thanks! Hello Everyone, i am new to HTML, i am trying to develop my first website. I am using asp.net , C#, HTML, CSS and Visual studio2008 on windows Xp I had a page, in that i moved the tables to center. after moving the tables to center i found the white space on the left and right sides of the page. Now i want to fill the white space which is on the left and right sides of the page with the black color. Can anyone please help me thank you regards john. |