|
HTML - (nooby) Alignment Problem
Hey
Can someone please tell me how I can cushion the object on the right to the content in the center? I can't use fixed widths, since the width of the central content differs. If I remove 'float: right;' from .css, the object goes behind the central content. HTML: Code: <div class="breadcrumbs-container">
<div class="breadcrumbs-left"></div>
<span class="breadcrumbs">
<a href="{U_INDEX}" accesskey="h">{L_INDEX}</a>
<!-- BEGIN navlinks -->
<img src="{T_THEME_PATH}/images/breadcrumb_arrow.gif" width="8" height="9" alt=">" />
<a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAME}</a>
<!-- END navlinks -->
</span>
<div class="breadcrumbs-right"></div>
</div><!-- /breadcrumbs container -->
CSS: Code: .breadcrumbs-container {
background: transparent;
margin: 0;
padding: 0;
height: 30px;
width: 100%;
}
.breadcrumbs {
background: url("{T_THEME_PATH}/images/breadcrumb-bg.png") repeat-x;
height: 30px;
float: left;
vertical-align: middle;
line-height: 30px;
}
.breadcrumbs-left {
background: url("{T_THEME_PATH}/images/breadcrumb-bg-left.png") left no-repeat;
width: 50px; height: 30px;
float: left;
}
.breadcrumbs-right {
background: url("{T_THEME_PATH}/images/breadcrumb-bg-right.png") right no-repeat;
width: 50px; height: 30px;
float: right;
}
Thanks Similar TutorialsI hope this is the right place to post this. Here is my question~ I want to send data from a radio button to another web page (apart of my web site), what kind of code do I need to learn to achieve this? Also, if this makes any sense, I want to take the code that I sent through a radio button and use that data for another function...I hope that I am as clear as possible... Thank you for responses in advance So im on my way in building this gallery. Pleas look at it here. The problem is with IE (big suprise) In some weird way it wont place the pictures inside the designated place. AND .. i REALLY cant explain this one error, the first picture of the gallery.. and only the first one, IE displays is in a TILTED way?? I was like, huh??? Chrome and FF displaythe page in exactly the same way. The page isnt finished yet but on its way, I would like to see IE respond in a normal way for once.. thanks for reading! so in the end of a form you normally have a submit button which sends it off to an email addy, but i want what the users put in the form fields to come up on their page instead i think this involves editing the FORM ACTION="" part, but dont know what to do if what i'm trying to do is confusing you, what i mean is there's a few drop down menus and comment boxs, they fill them in, click submit and what it would normally create to email someone comes up in an html page for them to see what they put On my website, www.JKRfan.com , the alignment on the layout is a little bit off and I can't figure out why. The problem with the alignment also changes from page to page. Will somebody please help? Thanks, Kristen i have uploaded my website. i m facing a problem. my website appears differently in different computers. its like changing alignment, table spreading so so. i used table to develop the site. how can i fix this problem. Can anyone help me? Hi, I've finally created a 2 level CSS menu and I've positioned a DIV layer below it for the content. However, I would like to know how to shift the content DIV layer up, closer to the menu (horizontal one). Or is my coding for the menu causing a problem? Here's my site btw: Click I am practicing code from a file and I am having issues. Specifically, I the geogebra applet is supposed to be framed in the right side, where the "buttons" are the left. I can't figure out why the file is not on the right side in its own section. Any suggestions? I am attaching the code using a word document... I highlighted what I feel is the problem. Nick I'm really stuck here. This has worked in the past, but not it seems to not be working. It must be a really easy fix. HTML Code: <body style="font-family:Georgia;"> <div align="center"> <div id="content"> Lorem ipsum... </div> </div> </body> I want the "content" field to be center aligned, but it is still sitting there on the left. How do I fix this? Thanks! I've been putting my layout into html from photoshop and finally finished, thing is I was using Firefox to view it as I went along. Now when I view it in Internet Explorer, there is this small unexplained space on the right side of my header image that is screwing up the page, plus the table that I have the navigations links on the top left has way more spacing between rows than it does on Firefox. Here's the layout: http://www.ff12guide.com/ the two problems a 1) the empty space to the right of 'header_red.jpg' and 'top-2-shadow.jpg' at the top of the page 2) the links in the 'sections' area at the top-left (characters, combat, etc.) is much more spaced out than it is in Firefox, and does not look right I absolutely cannot figure out how to fix this and it's driving me nuts, anyone have an idea? I have a content alignment issue in IE and I can not find the problem anywhere. In FF it looks perfect but in IE the content is at the bottom of the page and I do not know what or what I am overlooking and missing. I don't know if it is the php throwing it off. I wouldn't think so though. Here is the page: http://www.mesquitechristmas.com/local/display.php?id=2 Here is the code: PHP Code: <?php include ('db_connect.php'); if (isset($_GET['id'])) { $id = mysql_real_escape_string($_GET['id']); $sql = "SELECT * FROM users WHERE id = $id;"; if ($result = mysql_query($sql)) { if (mysql_num_rows($result)) { $row = mysql_fetch_array($result); $displayname = $row["displayname"]; $displaytype = $row["displaytype"]; $address = $row["address"]; $city = $row["city"]; $state = $row["state"]; $postal = $row["postal"]; $country = $row["country"]; $rating = $row['rating']; $votes = $row['votes']; $imgurl = $row['imgurl']; $comments = $row['comments']; } else { die("No user found"); } } else { die(mysql_error()); } } ?> <!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" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="description" content="Mesquite Texas Country Christmas" /> <meta name="keywords" content="Mesquite, Texas, Country Christmas" /> <meta name="author" content="NA" /> <link rel="stylesheet" type="text/css" href="/stylesheet.css" media="screen" title="FBC" /> <script type="text/javascript" src="drop_down.js"></script> <title>A Mesquite Country Christmas</title> </head> <body> <div id="wrap"> <a href="/index.html"> <img id="frontphoto" src="/images/header.png" width="760" height="237" alt="Mesquite Country Christmas" border="0"></a> <div id="menu"> <h2 class="hide">Menu:</h2> <ul id="avmenu"> <li><a href="/index.html">Home</a></li> <li><a href="/christmasstory.html">The Christmas Story</a></li> <li><a href="/directions.html">Directions</a></li> <li><a href="#">Information</a><ul> <li><a href="/information.html">Display Facts & Info</a></li> <li><a href="/faq.html">FAQ</a></li> <li><a href="/playlist.html">2008 Playlist</a></li> <li><a href="#">Christmas History</a></li> </ul></li> <li><a href="#">Photos</a> <ul> <li><a href="/2007photos.html">2007</a></li> </ul></li> <li><a href="#">Videos</a> <ul> <li><a href="/2007videos.html">2007</a></li> </ul></li> <li><a href="/guestbook.php">Guestbook</a></li> <li><a href="/webcam.html">Web Cam</a></li> <li><a href="/webradio.html">Internet Radio</a></li> <li><a href="http://www.noradsanta.org/" TARGET="_blank">Track Santa</a></li> <li><a href="/projects.html">Projects & How Tos</a></li> <li><a href="/links.html">Links</a></li> <li><a href="/contact_us.html">Contact Us</a></li> </ul> <center><a href="http://www.toysfortots.org/" TARGET="_blank"><img src="/images/toys_for_tots.jpg" border="0" width="110" height="153" vspace="10"></a></center> <center><a href="http://christmas.bronners.com/2007/house/534.html"><img src="http://christmas.bronners.com/voteforme/vote.jpg" border="0" width="110" height="153" alt="christmas decorations" vspace="10"></a></center> </div> <div id="content"> <div class="fadebox"> <h2><? echo $row['displayname']; ?></h2> <hr /> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center"><img src="<? echo $row['imgurl']; ?>" class="border" height="345" width="460"></td> </tr> <tr> <td> <table align="center"><tr><td>Rated 0 from 0 people | <b>Rate This</b>: <a href="displays.php?id=<?php echo $row['id']; ?>&rate=1">1</a> | <a href="displays.php?id=<?php echo $row['id']; ?>&rate=2">2</a> | <a href="displays.php?id=<?php echo $row['id']; ?>&rate=3">3</a> | <a href="displays.php?id=<?php echo $row['id']; ?>&rate=4">4</a> | <a href="displays.php?id=<?php echo $row['id']; ?>&rate=5">5</a> </td><td> </td></tr></table></td></tr></table> <table align="center" style="border-top: 1px solid rgb(51, 102, 51);" border="0" cellpadding="4" cellspacing="0" width="100%"> <span class="title">About this Display...</span> <tr><td class="bg2" width="100"><b>Display Name</b>:</td><td class="bg2"><? echo $row['displayname']; ?></td></tr><tr><td class="bg1"><b>Display Type</b>:</td><td class="bg1"><? echo $row['displaytype']; ?></td></tr><tr><td class="bg2"><b>Description</b>:</td><td class="bg2"><? echo $row['description']; ?></td></tr><tr><td class="bg1"><b>Address</b>:</td><td class="bg1"><? echo $row['address']; ?><br><? echo $row['city']. "," . $row['state']. " " . $row['postal']; ?><br><? echo $row['country']; ?><br><a href="http://www.mapquest.com/maps/map.adp?searchtype=address&formtype=search&countryid=US&addtohistory=&country=US&address=<? echo $row['address']; ?>&city=<? echo $row['city']; ?>&zipcode=<? echo $row['postal']; ?>&historyid=&submit=Get+Map" target="_NEW"><b>Get Directions</b></a></td></tr><tr><td class="bg2"><b>Website</b>:</td><td class="bg2"><a href="<? echo $row['website']; ?>" target="_blank"><? echo $row['website']; ?></a></td></tr><tr><td class="bg1"><b>Sponsor Links</b>:</td><td class="bg1"> <script type="text/javascript"><!-- google_ad_client = "pub-8048181801684156"; //displays google_ad_slot = "4239948836"; google_ad_width = 234; google_ad_height = 60; //--></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </td></tr></table> </div> </div> </div> <div id="footer"> © 2007 Mesquite Country Christmas <br /> <br /> <script type="text/javascript"><!-- google_ad_client = "pub-8048181801684156"; //468x60, created 1/8/08 google_ad_slot = "0360766123"; google_ad_width = 468; google_ad_height = 60; //--></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div> </div> </body> </html> If anyone can help me with this that would be great! -Thanks OK well This workse perfectly with a .html document, but when I use .php it all goes bad, http://rapid-hook.com/script-2/index.php The arrows ar suppose to be aligned with each other, but theres a gap between the table, for the bottom only, not sure how to fix this. Hi am trying to get multiple tables with different number of columns to be aligned properly. I'd expect the columns width the same width of both tables to be align properly. But they are not, as you can see on the attached picture at the bottom of the page. The first two columns look good, but the more columns I add the more shrewd up the result gets. Does anybody know how to get them properly aligned ? Of course it works if the width is given in px not in %, but that is not what I want to do. Using a single table and colspan is also not an option, as this is a simplified example of the problem. Thanx in advance. HTML Code: <html>
<body>
<style type="text/css">
.width100pro {
width: 100%;
}
.c1-6 {
width: 15%;
}
.c1-12 {
width: 5%;
}
.t1 {
width: 35%;
}
.t2 {
width: 65%;
}
.b25 {
width: 25px;
}
.b100 {
width: 100px;
}
</style>
<table class="width100pro">
<tr>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td class="c1-6"><input value="TestBig" class="b100"></td>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td class="c1-6"><input value="TestBig" class="b100"></td>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td class="c1-6"><input value="TestBig" class="b100"></td>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td><input value="TestBig" class="b100"></td>
</tr>
</table>
<table class="width100pro">
<tr>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td class="c1-6"><input value="TestBig" class="b100"></td>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td class="c1-6"><input value="TestBig" class="b100"></td>
<td class="c1-12"><input value="TestSMall" class="b25"></td>
<td><input value="TestBig" class="b100"></td>
</tr>
</table>
</body>
</html>
Hi, I can usually troubleshoot basic html issues, but don't have much knowledge of frames. The page design is a basic 2-frame horizontal format with body content files that swap in and out from a header menu bar. Both header and body files are centered, and should be visually seamless. The problem is when the main body frame is set to scrolling="yes", the scroll bar in the browser window offsets the center of the frame, and the two frames appear out of alignment. If the main body frame is set to scrolling="no" then they line up properly (but obviously cannot scroll down through the page). You can view the issue he http://www.sequentz.com/menutest/index.htm I would greatly appreciate some help sorting this out, so that the two files align seamlessly and the bottom file can scroll. Thank you. Goodday, This is a bit of a follow-up on my previous question, but in some ways, it's also a seperate problem: Have a look at this. In the first table, the height is determined by 'height="200"' and the position of the 'Text' is 24 pixels above the bottom, exactly what I wanted. But now in the second table: Here the height is determined by the content of the first row and the 'Text' part's height is way to big. What happened? Why isn't it showing a table with the height I have set? What should I do to tell a cell it's height, starting from the bottom of the table? Thank you for your help, Laurens, I am haveing trouble with my links..they are not going all the way to the right side..they stay under the text here is my website http://www.highlandartworld.com/ any sugestions? Hi all, my first post... I'm having troubles when i try to add a table after a left aligned table. When i add the second table it goes just at right of the previous table, not at bottom as i want. Example: HTML Code: <table width="60%" border="1" align="left" >
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<table width="60%" border="1">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
Any sugestions about placing the second table at bottom of first one are welcome. Can someone please help me and shed light on this? TIA!! I'm building an ecommerce site and there are 4 thumbnails that you can click on, then the main image swaps to the thumbnail you just clicked on (like how most ecommerce sites work). But I won't have 4 thumbnails all the time, maybe 2 or 3 but maximum of 4. When I test the page with 4 thumbnails, it works fine. But if I have only 2 or 3 thumbnails, the spacing looks odd on Firefox. (Looks perfect on Safari) I want them to be always left justified but they look like they are forced to be centered in the space given. What am I doing wrong? I appreciate any help! The following code is for the thumbnail: Code: <tr> <td width="60" align="left"><a href="#" onClick="javascript:image_click(1);return false;"><img border="0" src="thumbnail.asp?file=[image1]&maxx=60&maxy=0" name="pimage1"></a> </td>
<td width="5" align="center"></td>
<td width="60" align="left"><a href="#" onClick="javascript:image_click(2);return false;"><img border="0" src="thumbnail.asp?file=[image2]&maxx=60&maxy=0" name="pimage2"></a> </td>
<td width="5" align="center"></td>
<!--END: image2-->
<!--START: image3-->
<td width="60" align="left"><a href="#" onClick="javascript:image_click(3);return false;"><img border="0" src="thumbnail.asp?file=[image3]&maxx=60&maxy=0" name="pimage3"></a> </td>
<td width="5" align="center"></td>
<!--END: image3-->
<!--START: image4-->
<td width="60" align="left"><a href="#" onClick="javascript:image_click(4);return false;"><img border="0" src="thumbnail.asp?file=[image4]&maxx=60&maxy=0" name="pimage4"></a> </td>
<td width="5" align="center"></td>
<td width="60" align="left"></td></tr>
<!--END: image4-->
Hello there, I am in serious need of help. I am working on a site where I could update the navbar at any time and not have to change the code on numerous pages. After some reading, I concluded that the use of an SSI would be a suitable solution. With that being said, my headache ensues. I have developed an outline in dreamweaver for my website, and have created a div where the ssi will be placed. The navbar was created in Fireworks. In IE, i can get the menu to appear where I want it, which is below the flash image below the header, however, when I run the mouse over the dropdown, the drop down appears some 50 pixels above the navbar. I am thinking that this might be a css problem. In Firefox, the div tag appears off to the left and when the mouseover is done, the dropdown appears in the same place as they have in IE. In both instances, the dropdown menu is in line with the image used in the navbar. I would really appreciate any help someone could offer. If someone could send me a working solution, I would be even more grateful. I think my eyes are tired of viewing the code. the site can be viewed at the following url: http://www.prestigeinteractive.com/wmems2/ I would greatly appreciate any help you can offer. Thanks, Greg ps. if you would like the source files, email me at gwhite@prestigeinteractive.com I am hoping that someone may have a solution for me - in one of my table columns I have 3 images (logos that link to sites) and I have set them with a vertical top alignment - so that when the page goes long - the logos stay at the top - this works perfectly in all browsers, except (of course) IE... would anyone know how to fix this? My site can be viewed at http://bebywebtest.9k.com/history.html ... if you click open the collapsible menus - you can see the logos - start to center themselves down the page - instead of staying at the top... <br /> </td> <td width="5" rowspan="3"> </td> <td width="380" height="179" bordercolor="#000066" bgcolor="#FFFFFF"><div align="center"><a href="http://www.israelbonds.ca"><img src="Images/header-march-2006.gif" alt="bonds" name="israelbonds" width="256" height="100" border="0" valign="top" id="israelbonds" /></a></div></td> </tr> SO - if anyone has any suggestions on how to remedy this fiasco - I would be most grateful! Thanks. |
|||||||