HTML - Table Align Issue
If I have a table that has 2 columns and the second column has 1 row (rowspan="2") and the first column has 2 rows, how can I keep the rows in the first column aligned top regardless of the height of the second column?
Thanks~ Similar TutorialsHi All, im trying to align some Labels and text fields evenly through my page, Iv been trying to tweek it here and there and im just wondering have i missed a vital step to do some a thing....... the attached is what i have at the moment "image called Layout" and what i want to achieve is also attached the one with the Green Header my Css for this is here for the label HTML Code: .StandardLabel { width: 100px; text-align: left; padding-right:3px; font: verdana; font-family: Verdana; letter-spacing: normal; font-size: 15px; } for the text box HTML Code: .LongTextBox { width:170px; } and the HTML HTML Code: <div style="padding-top: 10px;"> <asp:Label ID="lblEmail" runat="server" Style="padding-right: 42px;" CssClass="StandardLabel" Text="*Email"></asp:Label> <asp:TextBox ID="txtEmail" runat="server" CssClass="LongTextBox"></asp:TextBox> </div> <div style="padding-top: 10px;"> <asp:Label ID="lblConNum" runat="server" CssClass="StandardLabel" Text="*Contact Number"></asp:Label> <asp:TextBox ID="txtContactNum" runat="server" CssClass="LongTextBox"></asp:TextBox> </div> I havent attached all the HTML but the code is identical to what i have added above. Hi guys, I am building web for friend and I have problem with aligning my div table on my sidebar. The sidebar needs to be on top of the page and i can't get it up there here is the website: herehere and here is my html where you can see how i have set up the divs : herehere If you can help me that will be grate. I NEED HEEEEEEELP Thanks Okay so I'm making a mock up sign in and log in page and this is what I want to happen but since it only has 2 columns, the log in page gets drag on the middle. i want it to look like this: I need 2 to go to the top like 4 is, and then 1 to go right below 2, etc. Photo below. I wanted to create 2 tables side by side with each other to form 2 columns. What I did was nested 2 tables into 1 table. However when I did this the text of one table is aligned halfway down the column. I tried aligning it to the top but it just stays there. Any idea what the issue is here. I have attached a picture and the source code to show what's going on here. Any help is much appreciated. Jesse Ok, i have a table and there two images in two different frames next to each other. Sence one is taller than the other, the smaller one is centered in the middle of the <td> I want to have the tops of the images aligned, do you know how to do that? http://sugarbat.org/plugboard The table wont align with the image. Why? I have a table that is saved from Photoshop. It's a table with a load of cells inside. How can I vertically center the table? Not its content, I mean the actual table itself so it centers itself no matter the resolution of the screen it's being displayed on. Thanks, Simon Hi All, Am a bit of a newbie here. I'm having a little problem with a table that I created on Wordpress. After creating the table, the image below shows how it looks like on the Wordpress editor: But, once published, the row alignment is a bit off. Here's the url: http://runfest.my/?page_id=346 Appreciate some advice on what went wrong and how I can fix it. Thanks a bunch! I'm building my website and I've just noticed that the left bar has suddenly shifted away from the left edge of the screen. I have no idea what I did to cause this and can't seem to fix it. In an attempt to figure out which bit is wrong I have cut back all the rubbish until I'm just left with a basic left aligned table - Code: <html> <body> <table width="90%" border="1" align="left"> <tr> <td> XXX </td> </tr> </table> </body> </html> Now that's pretty simple. can't get much more cut down than that - a left aligned table. The left alignment is working such that the table is to left of centre, but the problem is that (on my system at least) the left edge isn't butted up against the left edge of the browser. So what the heck is the problem? I have a logo image and a table (being used as a nav.) I want the table to be centered vertically on the right side of the logo. Here is what I have so far: css: HTML Code: body .logo {position:absolute; } table {width: 65%; margin: 20px auto 0px auto; border-bottom: 3px solid #3399cc; } html: HTML Code: <div> <div id="Drafting & Design Logo" class="logo"> <img src="menu/Logo.png" height="155" width="139"> </div> <div> <table> <tr> <td width=18.3%><a href="#" id="drafting" target="_new" /></td> <td width=25%><a href="#" id="programming" target="_new" /></td> <td width=18.3%><a href="#" id="resume" target="_new" /></td> <td width=18.3%><a href="#" id="contact" target="_new" /></td> </tr> </table> </div> </div> I want the entire thing centered in 65% of the browser window. Right now the image off to the left and the table is centered. When I change the margins on the image it doesn't do what I would like it to. Also, the reason I don't add it to the table is because I want to have a line under the nav bar stopping at the logo. Any help would be greatly appreciated. Hi there, After HOURS of battling with what I thought should be so simple I have given up and registered for help! The very basic form of my problem is I want a table with 3 cells, The first two cells (one black, one blue) I want to be left aligned and simply as wide as the cell contents. I then want the 3rd cell to be right aligned, and fill up the rest of the row before reaching the text. So the 3rd cell spans from the 2nd cell all the way to the right of the table. I have uploaded 2 images. One is the rough design that I'm trying to achieve, the other shows my results. what I want: http://imageshack.us/photo/my-images/705/hopez.png/ (the 'music videos' would be in a separate cell as the background will be blue as you can see in my tests below) actual: http://imageshack.us/photo/my-images/830/problemue.png/ It either ends up as above or with hours of fiddling I did somehow have it over at the right, but only behind the text was black, there was just open space between the blue cell and the right aligned cell. So frustrated, better go to bed, haha. I apologize if it is improper protocol to post a link rather than the actual code but since View>Source exists for seeing both the html and css code and there is a fair amount of code...here is the link: http://nicolemuller.com/IMS/FINAL/ne...al/signin.html I don't know what I'm doing wrong but I cant get all the elements in the 2 rows to align and center with the rule of the menu strip. Any help would be great-thanks! If I want to make a way to have that table move ends? his may be a dumb question but how do you get a table to align to the absolute top of a webpage? Thx Snaps01 Not a major programmer but I needed to make a website. I am having a problem with my website where I have 5 pages, same structure, built with tables, all tables centered. In IE the tables align center on each page. But in Firefox --- 3 of the pages are different, lining up about 10 pixels left of center. Does anyone know how I can fix this problem? I have browsed around other sites as well and many of them have this problem. Any advice would be greatly appreciated. I know tables are horrible but thats all I know/can learn. Hey guys, What I am trying to do is align a whole table to the right inside of a td tag of another table. It looks fine in IE, but in firefox it comes out wrong. Any idea what I can do? Here is the code: Code: <table border="1px" style="width: 100%;" id="rptPrintform:alignBtn_pg_id"> <tbody> <tr> <td class="alignRight"> Correct </td> </tr> <tr> <td class="alignRight"> <table border="1px"> <tr> <td class="alignRight"> Text </td> <td class="alignRight"> Text 2 </td> </tr> </table> </td> </tr> <tr> <td class="alignRight"> Correct </td> </tr> </tbody> </table> What I would like is for it to work in firefox the exact same way it works in IE. Thanks, Grae Hello everyone, I've been racing to learn html/css in the past couple weeks to throw up a website, and so far so good. But: I've searched the internet and I cannot find an answer to my questions. The page in question is: http://www.andrew.cmu.edu/user/jonmille/projects.html style sheet (relevant section is in the "Programming: List Settings" section) http://www.andrew.cmu.edu/user/jonmille/style.css You can see that the gray borders under the text/images have a small break in them. I assume it has something to do with the fact that I'm using two columns. How do I fix this and make a solid border (in a non hackish way)? Note: if you say "use css/divs," I wrestled with those for about two hours before I gave up and made a table. Secondly, in IE7, all the images/text are completely flushed left, ignoring the table padding. How can I fix this? Note, I've never checked this site in IE6 or below, and never will, so if it looks wrong in IE6, then the user doesn't deserve to see my site anyway. Thanks for your time! Jon Hey all.. I have an image that is not lining up in IE6, but does fine in FF... Here's the code: Code: <table height="400px" bgcolor="#efefef" width="192px" cellpadding="0" cellspacing="0"><tr><td height="20%" > <img src="images/module_header.gif" height="23px" width="190px" align="top" /> <a href="linkgoeshere.html" border="0" /> </a> </td></tr> <tr> <td> <center> <img src="images/module_header.gif" height="23px" width="190px" /> <a href="http://bbsnews.net/bbsn_weather/current.php?config=&forecast=zandh& pands=28792&Submit=GO" title="Commercial Free Weather at BBSNews.net"> <img valign="top" src="http://bbsnews.net/bbsn_weather/current.php? forecast=hourly&pands=28792&config=png&alt=hwicc&hwvttf=BOGSTAND& daysonly=1&hwvbg=efefef&hwvtc=black&hwvusettf=1" border=0 width=166 height=77></a> </center> </td></tr></table> </td></td></table> And here's an image of what I mean.. The two module headers at the top should be to the right... above the other items. Help would be much appreciated.. this is the last time im gonna nag any1 over stupid stuff if i could just get some help on this last issue i wont bother the forum members with my nonsense anymore, i ordered 2 html books on amazon.com and a java book my site is 100% ready to go public except this 1 issue i have .... I cant get my tables to properly work arround my flash menu ? you can see here if you minimize the window the table lets my flash menu move into my text it use to not do this but i dont know what i did... http://www.freewebs.com/fallingrain11/outcome.html the code im using for this is below :: <tr><td bordercolor="#7FFC00"; align="left" Width="17%" valign="top"> <div id="object1" style="position:absolute; visibility:show; left:25px; top:-50px; z-index:2"> <a href="javascript:void" > <object cellpadding="100"; classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="143" height="395"> <param name="BGCOLOR" value="#0"> <param name=movie value="irawr-flash-menu-vertical.swf"> <param name=quality value=high> <embed src="irawr-flash-menu-vertical.swf" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="143" height="395" bgcolor="#0"> </embed> </object> </a></div> |