|
HTML - Tables - Most Useless, But One Of The Most Needed Elements
Hi All,
AHHHHHHHHHHHHHHHHHHHHH Tables have got to be the most useless, but one of the most needed elements of a website and every time I venture out to create a site the majority of my problems are because of this, and in the end cost me mega bucks in wasted time - like now. I just simply need the width function to work like most people wish it would. If I set the TD to be 40px wide, I want it to be 40px wide - regardless of what is trying to be put there. If too large truncate it, if too small pad it. So bottom line is I have a table that is 850px wide, with 12 TD's being various sizes from 10px to 410px. If you maximize your browser it will be in the middle, if you resize the browser width, it will scroll. I would prefer no wrap in cells as well, but can live with it. If someone can show me a way to do this successfully that would be great as over the years I have just micky moused things, but that won't work here. If CSS is needed, no problem. Oh, the cells also have 1px borders on them. So it looks like an Excel Sheet. Thanks for the help Similar TutorialsHello I'm having terrible trouble aligning my text into a layout using tables i will include a screen shot to show what im talking about. i thought i could fix it by putting valign=top in the td tag but nothing seems to be working if someone could help me out i would greatly appreciate it. THanks heres the screen Should I worry about frames? Or are they just useless? IE7 sometimes displays messages in the yellow bar at the top of a page regarding active content running on the page. This happens when you have JavaScript running in the page. Also with Flash it's now required to click the Flash control to enable it. Some sites however, like Nokia.com for example have Flash embedded but IE7 doesn't ask me to click the thing to enable it. How do they do this? Is it also possible to tell IE7 that my JavaScript is not malicious and have it not display the message to people that will visit my site with IE7? How do I make element's change their height automatically depending on whether they have anything contained within them? My page background is a div's bg image but the div hasn't expanded to the size of the contained elements. The div's name is nicola-bg Here is the site I have the same problem too with #image-section. That div is styled to have large borders but the borders don't extend to the height of the div's containing elements. Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts I'm trying to understand the need for <div> elements, couldnt we do the same things with a <p> element. I understand the <span> element because it allows you to have box models for inline elements. Is <div> mostly to keep things organized and easy to read? Hi, I have a form with html combo and input elements in a dialog with scrollbar. Problem I am facing is some of combo elements which are disabled disappear. When I scroll the disabled elements appear again. This happens only on IE. Works fine on firefox. Is there any issue with disabled elements as such. Thanks This is my first project using CSS and anything other than basic HTML and it's been going good so far. The page I'm designing is for my new guild on World of Warcraft (yes I'm addicted) and my problem is with the Content DIV i created. The site is http://twilightsdawn.50webs.com/index.html In the code, I nested DIV elements containing the actual news posts themselves within the actual Content DIV, and by not specifying a height I had hoped the element would resize and simply tack on extra DIVS below one another. This seems to be the case with Banner and Content Text DIVs but the second set simply overwrite the previous and all my attempts to force the second "news post" below the first have failed or resulted in bizarre alignments. I am at a loss and would appreciate any design suggestions and/or feedback on the code. Thanks Hello everyone, I have a problem and it is driving me insane :/. I am trying to create 3 inline boxes (using span or div?) that are right next to one another (ie. with no borders). The two at either side are of length 25% and the middle is of length 50%. Here is my effort at coding it myself : 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
body {
word-spacing: 0px;
}
.sideWrap {
top: 0px;
width: 25%;
height: 100px;
background-color: #0CF;
display: inline-block;
}
.sideWrap2 {
top: 0px;
width: 25%;
height: 100px;
background-color: #0CF;
display: inline-block;
}
.center {
padding: 0px;
margin: 0px;
left: 25%;
width: 50%;
height: 200px;
background-color: #0F0;
display: inline-block;
}
</style>
</head>
<body>
<span class="sideWrap"></span>
<span class="center"></span>
<span class="sideWrap"></span>
</body>
</html>
But unfortunately, this produces ... something I dont want .. as shown by the attachment. This clearly has inexplicable white borders that I have not coded :S, and the three blocks are not inline. Can anyone give a simple explanation as to how to put these in line and eliminate the border between them? Thanks in advance, mintsmike Please help me, I'm trying to hide elements (boxes) is HTML in this way: <?php if($_POST) { //left.style.visibility="hidden" document.getElementById(left).style.display = 'none'; } ?> By checking if a form had been submitted...But when displaying the page all elements on the page is hidden not the element "left" only..Why? Thanks is advance. Is there a way that anyone knows of to put list items side by side in a row? I'm currently working with some html/css/jquery that allows you to move li elements around and order them. However, instead of being on a new line for each element, I'd like to put several side by side in a row. Is there any way with html/css to make this happen, or is there no way to change the "nature" of li elements? I am using ASP.NET however my front end design skills arent that great. what I was wondering was, since I am using a repeater or a datalist control, I want each element to have a nice design. the site is like a products site (retail type website). I mean, the styling for each element is something I im unsure how to design, any suggestions or tips on how each element should be designed/layed out? product detail: qty, product name, image, smalldescription. styling/designing/theme doesnt matter, you can include that. just a rough guide would be nice in terms of how the layout for a product should be design, like where each piece of information should be layed out. thanks. thanks. Hello everyone, Hopefully this is simple: I have 2 definitions - and I don't understand what they are trying to say exactly. Definition 1: Logical Element: An element that describes the nature of the enclosed content (but not necessarily how that content should appear in the browser) Definition 2: Physical Element: An element that describes how content should appear, but doesn't indicate the nature of the content What is meant by "the nature of the enclosed content" ... and could someone please break these down for the beginner? Thank you. Hi, I have a form that has a bunch of cascading drop downs - something like Country->State->City->. Each subsequent drop down is populated based on what is selected on the preceding one. What I am having trouble with is the positioning of the labels for these dropdowns. For ex., I want the word 'Country' written exactly above the Country dropdown, the word 'State' above the State dropdown and so on. Unfortunately, anything I try doesn't seem to work. I have used every CSS property I thought would help - margin, position, padding etc., but nothing works. The problem is when I resize the window the labels and the dropdowns are thrown out of whack and it becomes difficult to figure out just by looking which label belongs to which dropdown box. How do I fix this and align the form with their respective labels and make it independent of the size of the window? Thanks! I am currently creating some code containing a horizontal rule, some headers and a link that takes the user back to the top of the page. The page should look something like this... ------------------------------------------------------- HEADER ------------------------------------------------------- back to top HEADER How can I make it so that the header is the same distance from the horizontal rule regardless of whether the back to top link is present? At the moment whenever the 'back to top' link is present the header below is pushed down. Here is my code so far... Code:
<style type="text/css">
a{
margin-left:700px;
}
h2{
margin-top:20px;
}
</style>
<hr>
<h2>HEADER</h2>
<p>Paragraph here</p>
<hr>
<a href="#top">back to top</a>
<h2>HEADER</h2>
<p>Paragraph here</p>
Trying to modify a template.. http://www.varaxon.com/ On the right, below the login box are 3 seperate boxes - I've been trying to make these completely clickable - I just can't seem to figure it out. I tried doing unordered lists, etc. Color me stupid - I'm just a lowly PHP Developer with minimal design/html coding experience. -G I am designing the home page for a website. I have a list of links that is the site index that is 300px wide. I want this on the left side of the page. I want a paragraph that will basically be a introduction to the website to be inline with the index... sitting to the right of the index rather than below it. here is a simplified version of what I have: <body> <div id="wrapper"> <div id="head1"> <h1> page title </h1> </br> </div> <div id="list" <ul> <li> <a href="perps.html"> blah</a> </li> </br> <li> <a href="Why.html"> blah </a> </li> </br> <li> <a href="surveillance.html">blah </a> </li> </br> <li> <a href="me.html"> blah </a> </li> </br> <li> <a href="network.html"> blah </a> </li> </br> <li> <a href="mystory.html">blah </a> </li> </br> </ul> </div> <div id="intro"> <p> ***paragraph text****.</p> </div> </div> </body> CSS sheet: #list { width:230px; padding: 20px 0 0 20px; border-style: solid; list-style:none; } #intro { border-style:solid; float: right; padding: 0 0 0 0px; margin: 0 0 0 300px; border: 0 0 100px 0; } I know i need to use "span" but I have no idea where to start. Any help would be greatly appreciated. Hello everyone, I'm new here. I hope someone will help me with my problem. You can see it he http://kahoe.monline.dk/portfolie2/index.php EDIT: Problem 1 solved. Problem 1 is in the grey menu to the right. I've used php include_once to insert four div elements (with images and a little text), but they position themselves in a strange way. It's supposed to be a collumn. You can see the html file with the four elements he http://kahoe.monline.dk/portfolie2/globalmenu.html I should probably say that I've used javascript to make a hover effect with the images. (Do I need to include code in this post, or do you guys usually view CSS and HTML in the browser?) Problem 2 is with IE. I have IE 8 installed, so I don't know about other versions, but this one can't find the images on my website. It works fine in Firefox. What's wrong? Problem 3 is with the div element at the top of the page, the one which contains the text "Denne hjemmeside ses bedst med Firefox. Download Firefox her. " I can't get it to sit at the very top of the page. I've used body { margin: 0; padding: 0; } in the stylesheet already, but it's not enough apparently... Hi everyone I've developed a website and now when it got ready someone discovered that the sidebar isn't floating correctly in his mozilla firefox. It works fine in my firefox and IE and in his IE, but not in his FF. So I have a screenie how it looks like when it's wrong and when it's right: Right: Wrong: The source is at www.latvala.com Please help me |
|||||||