|
HTML - Problem With Width Management In Ie
Similar TutorialsHey guys, I'm having heaps of problems dealing with this damn tables.. can someone help me correct by putting da right navigation bar back inside, and the bottom table fit? If i copied and paste the Wine Events tables inside the left side for another Event box, how do i put a <br> to the next tables made? Thanks guys p.s File test5b.html thanks! Hi, I am using tables in dreamweaver, making a bottom border for each cell, but I dont want it to go all the way across, I want a short bottom line, here is the code: <td colspan="2" valign="top"style="border-bottom: 1px solid #AF0A10"> let me know how to make the bottom line at like 50% Thanks! -Sean Hi there. I am working on this site. There is a problem with a table column spacing though... if this is what it looks like in Firefox (the way its supposed to be...) and this is what happened to it in IE. (dear lord...) the left menu and the content on the right are two adjacent cells of a table. how do i fix this ? it seems ie is giving equal width to both the cells. which explains the gap. i've tried using: Code: <td width=180> and also: Code: <colgroup span="2"> <col width="180"></col> <col width="500"></col> </colgroup> but none of them work. please help me out.. the page is available at > http://ramniquesingh.googlepages.com/index.html the .css file is available at > http://ramniquesingh.googlepages.com/default_style.css thanks. ok, im trying to make a shoutbox and i need the box to be a max width of 200px. But, since the shoutbox entries are going to be dynamic, theres a problem. In a table cell, if you have a string of characters without spaces, it will extend the width of the table cell (and entire table if appropriate) in order to accomodate this... The problem is, i need the table width to stay constant... 200px. Ive tried using normal width attributes and css in each of the td, table, and div (around the table) tags, but that does not work-- the table still extends horizontally in order to display the string. Is there anyway I can staticly set the table width to 200px and keep it that way? Frankly, i dont care what happens to the extra long string, short of deleting it altogether, i just need the table to stay a constant width Here is my current code: <TABLE width="215" border="0" cellspacing="0" cellpadding="0"> <tr> <td><TABLE width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> VARIABLE TEXT </td> <td align="left"> IMAGE </td> </tr> </TABLE></td> </tr> <tr> <td> random text that is lengthy </td> </tr> </TABLE> My problem is that I want the image to be displayed right next to the variable text . but since the variable can be any length, it is not getting displayed right next to the image. It is turning out to have a large gap in between the variable and the image. The variable can be any length... it could be "hi" or "hellooooooooo" but the image still needs to be displayed exactly to the right of it. How can I fix this? Hi All, Im using Visual Studio 2010 to create a website, im trying to set the width to 100% so it fits the users screen, when i flick back and forth from the design to the html Code the Design is fitting the Screen 100% but when i launch the site it still remains 900px in width? heres my CSS iv also checked the .Header css and that also says 100% any ideas? HTML Code: .page
{
width: 100%;
background-color: #fff;
border: 1px solid #496077;
}
.header
{
position: relative;
margin: 0px;
padding: 0px;
background: #4b6c9e;
width: 100%;
}
This is the Site Master Page. HTML Code: <%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Site.master.vb" Inherits="Learning.Site" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="page">
<div class="header">
<div class="title">
<h1>
My ASP.NET Application
</h1>
</div>
<div class="loginDisplay">
<asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
<AnonymousTemplate>
[ <a href="~/Account/Login.aspx" ID="HeadLoginStatus" runat="server">Log In</a> ]
</AnonymousTemplate>
<LoggedInTemplate>
Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server" /></span>!
[ <asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/"/> ]
</LoggedInTemplate>
</asp:LoginView>
</div>
<div class="clear hideSkiplink">
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
<Items>
<asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>
<asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>
</Items>
</asp:Menu>
</div>
</div>
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server"/>
</div>
<div class="clear">
</div>
</div>
<div class="footer">
</div>
</form>
</body>
</html>
Can someone try and shed some light on this please? Thanks I have found what seems to be a rather big problem in the HTML canvas When drawing circles, and I presume all shapes, the size of the circle is different based on whether one is filling it, or sketching it. If we have a circle of radius 10 and line width k, and we decide to fill it, that line width will be evenly dispersed about the perimeter of the circle such that half the line width is inside the circle, and half is outside the circle. If, however, the same circle is sketched, the line width will still be the same, but it will now be dispersed entirely on the outside of the circle, thus making it larger. If I am wrong, and this is how figures are supposed to be drawn, or if I am simply not using the right settings, please let me know =) Hello Everyone! (hoping for quick reply.. lol) I am not sure if this should go here, or in the design section. I chose here, because it is a problem in the code itself. I have introduced myself in the introductory section, if you want to know a little bit more about what I am doing this for. I made a template design in The Gimp photo editor. I sliced it up, and opened up the HTML file in the editor Kompozer. It opened up just like it should, but I wanted a liquid type layout, so I turned the cell's widths into the corresponding percentages, though Kompozer rounded them off. (Shown below) However, when I previewed the file this time, it appeared as if it skipped every other cell, leaving a blank white space in its spot. Not even in the right percentages. I think I know what I've done wrong, looking back now that I am writing this thread. Can someone please point me in the right direction? EDIT: Code posted as comment, due to lack of character room. Until I die, I will never quite understand tables - if someome could shed some light on this it would allow me to keep what little hair I have left. I have a Table with some form inputs in it as outlined below, the problem is this, there is what looks like a 15px space on the right side and I don't know why its there. Two questions: Size="18" - 18 what? I read that these are the size of a space, but if it is, what is the size of a space? Second, width="50" - 50 what? I am assuming pixels, but with all the problems I seem to have with tables, I'm not sure. <fieldset style="width: 260px"><LEGEND class="legend"> <table width="260"> <tr> <td width="240"><input type="text" size="18" etc.> <td width="20 align="right">There is a 10 x 10 graphic here</td> </tr> </table> </fieldset> Hope I made sense, any help or guidlines that could ease my life with tables would be appreciated. Thx Morning all, I am workign on a small intranet for my department at work. In creating it, this project has slowly snowballed into a larger project. Like most anything we do in life The issue I am having, in the front screen, they would like to show our monitoring software, so at first glance you can tell if any servers are up or not etc. using iframes in design mode, it looks great. But when I view the page, the website I am calling in the iframe takes over the whole page. Below is the code, is there any fix or even so a better way of doing this? Code: table border="0" width="97%" id="table1" cellspacing="0" cellpadding="0"> <tr> <td width="1063"> <table border="0" cellspacing="5" cellpadding="5" align="left" style="border-left-width: 0; border-top-width: 0; border-bottom-width: 0; width: 74%;" id="table2" height="412"> <tr> <td style="border-right-style: solid; border-right-width: 1; border-left-style:none; border-left-width:medium; border-top-style:none; border-top-width:medium; border-bottom-style:none; border-bottom-width:medium; width: 90%;" valign="top"> <p class="MsoNormal" align="left"> <iframe src="https://btdhcp" height="400" width="800" frameborder="0" scrolling="yes"></iframe></p></td> </tr> </table> Any assistance or guidance would be greatly appreciated. Orion Hi all, I'd really appreciate some help on this one. I have a program which outputs very long strings of text to a HTML page. At the moment the text stays on one line resulting in an annoying horizontal scrollbar. How do I get the page to automatically format the text so that it all fits within a standard width, and so there's no horizontal scrollbar? Regards, Ruth I have a very simple table that I cannot simply get to render correctly across IE, Firefox, and Opera. At first, I was using CSS to define the cell widths/heights - when that was giving me issues I got rid of all the CSS and attempted to use plain HTML. The problem persisted. Here's the code - it doesn't get much simpler than this: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1"> <tr> <td width="15" height="33">a</td> <td>b</td> <td>c</td> <td width="15" height="33">d</td> </tr> <tr> <td colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Appearance in Opera Appearance in IE7 Appearance in Firefox (this is what I want it to look like in all browsers) I haven't done HTML seriously in 7-8 years or so but I don't really remember having these problems with IE/Netscape. The fix I found for IE was to use style="table-layout: fixed" for the table: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1" style="table-layout: fixed"> <tr> <td width="15" height="33">a</td> <td>b</td> <td>c</td> <td width="15" height="33">d</td> </tr> <tr> <td colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Now IE works fine, Firefox didn't break, but Opera's cells still are not 15 pixels. IE7 Appearance fixed Here's my attempt at getting Opera to display it properly by mixing CSS and HTML: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1" style="table-layout: fixed"> <tr> <td style="width: 15px; height: 33px" width="15" height="33">a</td> <td style="height: 33px">b</td> <td style="height: 33px">c</td> <td style="width: 15px; height: 33px" width="15" height="33">d</td> </tr> <tr> <td style="width: 100%" width="100%" colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Opera looks even worse now This seems like such a simple table. I really don't understand why I'm having such a hard time. I believe the second row - using colspan is causing the issue. Please don't answer with - "dont use tables" or something silly like that Thank you -TableTrTd Hey, I'm trying to set something so simple as the TD width for 1 specific column, but it will NOT listen to me! http://www.unreal-deals.com/ebook/ad...i-showdata.php I've set the td width on the second column Item_Name to be 5000px, just to see if it would work. It does nothing. No matter if I set the table width to 100% or 300%, setting the TD width does not affect that TD... What am I missing here? Thanks im creatinh a box containing a text. The box must be wide enough to fill a text. menu.style.width = tekst.length - this functioin gives the number of letters in text. So if the text is "hello" then the width is 5 pixels. But i need the widith of pixels needed to fit the text in a box. How can i do that? Hi, Is there away to force my website to fit an Iphone screen when viewed on the iphone. At the moment the width doesn't full span the Iphones screen so it looks bad. http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Thanks alot Joe I don't know if this is supposed to be posted here or in the css forum - so correct me if I'm doing it wrong. I'm making a table with a variable number of colums. The first column should be allowed to have a width of 30 % if it is needed by the text, but less if it is not needed. (This can style="max-width:30%" do for me). The rest of the columns can use the space that the first columns doesn't use, but shouldn't be able to force the first column to be smaller. If I use max-width the first column might be smaller than 30% because of the rest of the columns forces it to be so, and if I use width=30% the width will be 30% even if the text in the first column doesn't need 30%. Can anyone help me? Hey all. This is my first post on this forum and I'm new to HTML and CSS, so please bear with me. I apologize if it's in the wrong forum. I've got a problem with my HTML code (I combine HTML with CSS). Imagine I have a navigation bar on the left that takes up 10 'em's. Just to the right of that navigation bar is the space that contains the actual content of the page (separated by <div id="actualcontent"> </div> tags. Works just fine... till I define a table within that content tags. The table is almost always too large (a horizontal scroll bar appears) or too small. I want the table to fill exactly 100% of the width of the "<div id="actualcontent"> </div>" tags, not 100% of the width of the whole window (which would include the navigation bar). Code: <table width="100%"> </table> makes the table as wide as the window. Yet, I want it to be only as wide as its parent (the actual content). I do not want to set the width to something like "80%" and HOPE that the size is okay and no horizontal scroll bar shows up. Because it could be too much or too less once the user resizes the window. However, if I specify the width in pixels or 'em's (in CSS) I'll have the same problem: I can never be sure that the table will fill out EXACTLY 100% of its parent, the width you specify seems to always be the width in relation to the whole window. Is there a solution to my problem? Thanks in advance , AvoC code: <table width="464" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutDefaultTable--> <tr> <td width="282" height="88"></td> <td width="136"> </td> </tr> <tr> <td height="76"> </td> <td valign="top"><img src="../Images/yoga_sangha-title.jpg" alt="title" width="557" height="131" /></td> </tr> </table> in browser, the <td width="282" height="88"></td> element has width of alomost 0 instead of a width of 282. Why? Thx. Please check my new website at http://www.lombrozo.co.uk the main part of each page is a table with width set to 100%, but as you can see, it doesn't quite fill the width of the browser, you can see this by the thick grey line on the right side... Any ideas? any help much appreciated. Thanks, Simon. |
|||||||