|
CSS - <ul> Aligning And Table Issue.
http://www.gaminghybrid.com/cms_design/
I would like to get the top tab table (#top-tabs) and the sub tabs (#sub-tabs) centered, instead of the semi-left alignment they are in. What is the best way to go about it? (I've tried <center> and text-align:center) Also, as you can see in FireFox, the bottom bite doesn't go to the bottom of the other two content bits, but it does in IE. Any help is appreciate Similar TutorialsI'm attempting to vertically align my content to the size of the browser window, something that I've concluded can be done a million ways after days of Googling and reading. My outcome seems to work fine in all browsers (FF, Safari, Opera, Chrome, Navigator are the ones I've tested) except Internet Explorer. It renders perfect in IE 8, but there is a huge margin bumping the content down in all other versions of IE. The complete execution can be seen he http://www dot kristenshemanski dot com/testing/index dot html Any thoughts/input is welcome. I've completely hit a wall with this one. Also, I am indeed still using nested tables. I still have not completely mastered div tables, so I've decided to stick with the familiar until I learn a bit more. This project has really opened my eyes to how out-dated my coding is. Here is my CSS for the vertical positoning: Code:
/* Divs */
#outer {
position: absolute;
height: 100%;
width: 100%;
border:0;
overflow: visible;
vertical-align: middle;
}
#inner {
position: relative;
top: 50%;
height: 645px;
width: 100%;
margin: 0px auto;
}
Wasn't sure if this was a CSS issue or an issue with the HTML. I am not using a DOCTYPE declaration, so that may also be the issue. I have a portion of a page where I want an image to appear. It is a static image that sits in between 2 scripts. When placed, in both IE and Firefox, there is a 1-2px white space between it and the next TD. The original code was like this: Code: <td width="144"> <SCRIPT> write_minorlinks_xml() </SCRIPT> <img src="images/site/database.gif"/> <SCRIPT> write_dblinks_xml() </SCRIPT> </td> Which makes it appear as this in either browser: I added a div into there so now it reads: Code: <div class="db"><img src="images/site/database.gif"/></div> Stats as follows: image width = 144px I've tried changing the TD, Table and Image attributes both in the CSS and in the HTML itself. No change. It is also important to show what the scripts do. You can't view it in the source but if you could, it would show up like this: Code: <td width="144"> <TABLE class="links" border="0" cellspacing="0" cellpadding="0"> <TR><TD class="minor_link"><span class="minor_link"> <a href="url" target="_top">name</a></span> </tr></td></table> <img src="images/site/database.gif"/> // </td> Also to note, the XML in the script name is in the name only. And the class "minor_link" does not exist. I am thinking that the extra space could be because of the code the scipts put in there. However, Since putting the image code into a div, I changed the background color to #FF7A7A (which is the pink color of the trailing edge of the image, which matches the border to the right of it.) As a result, Firefox now displays it as: Which is fine for cheating sake, but it still displays as the first image in IE. Here is the portion of the CSS that concerns the div (which has made no change in either IE or Firefox) Code: div.db
{
background-color: #FF7A7A;
padding: 0px;
margin: 0px;
}
Any help or ideas would be appreciated. I can't post URLs here, so please copy/paste the URL below. Look at the "email to friend" and "post to facebook" links on this page (url) proofs.gentryfoto.com/p/rswedding/1281copy27 (/url). My goal is to: 1. underline the text only, not the icon. 2. center the icons over the large image on the screen 3. Have it look the same in IE and FF. Currently, the icons are in the same row in IE, but are breaking into multiple lines in FF. I want them all on one line. What am I doing wrong? I am doing all kinds of experiments but can't get this right. Thanks. I seem to have messed up while slicing...If my font size is too large, it'll mess up my table positioning...I'd like to know if there's any way to align text to the bottom of a table collumn? Is there anything I can put in my style sheet to do this? Am I not being clear enough? Please help. EDIT : I've got a picture uploaded. See how on the left there's that white space? And under "Welcome" there's also a lot of space? I figure if I could align the text to the bottom, it'd fix both problems. =/ I have decided to move another of my sites over to css, but I seem to be stuck at the first problem. I have added a small code sample... What I am wanting to do is remove the table and acheive the same result with css and div tags. How can I align text to the bottom right with css like the sample code? PHP Code: <!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> <title>Text aligned bottom right</title> </head> <body> <table border=0 height="90px" width="100%"> <tr><td style="vertical-align: bottom;background:white;text-align:right;"> <a href="">Home</a> | <a href="">About</a> | <a href="" >Contact</a> </td></tr></table> </body> </html> The problem that I am having stems from attempted compatability for 1. IE/other browsers, and 2. Not scrolling or having an absurd amount of dead space on different resolutions. Given that I'm currently using a 16:9 laptop, anything that I make for my resolution is very likely to scroll vertically on anything else. I would like to preface this by saying that, while I am a young person and am .. relatively web savvy, I'm also pretty miserable at CSS. I'll pick it up whenever I need to use it, but these times generally end up being a year plus apart, and so I generally .. forget everything that I picked up the last time, and have to re-learn. I am very good at nesting tables, and using an absurd number of them to get things to look how I want, but .. I really want to get away from that. CSS is cleaner and less .. well, less flat out dumb than using seven tables in one page to align things the way you want them? The Actual Problem I Have: (Do ignore the hideously coloured background, the green/blue combo is temporary until I get the code working properly. Anyway, so apparently I can't post URLs so: clocktock.com is the website in question, code on it is Code: <html> <head> <link rel="stylesheet" type="text/css" href="poing.css"> <link rel="icon" type="image/png" href="img/RL16.png"/> <title>[ eroding.net ]</title></head> <body> <table cellspacing="0" cellpadding="0" class="main" height="100%" width="100%" valign="bottom"><tr><td width=100% align=center valign="bottom"> <table border="0" cellspacing="0" cellpadding="0" height="90%"> <tr><td background="img/top_left.png" width=14 height=39></td> <td background="img/top.png" width=622 height=39><img src="img/top_left2.png" border=0></td> <td background="img/top_right.png" width=14 height=39></tr></td> <tr><td background="img/left.png" width=14 height=1></td> <td bgcolor="black" width="700" height="800" border=0 cellspacing=0 cellpadding=0 background="img/table_bg_grunge.png" valign="top"> <br><br> <center> aaa <br><br> </center> </td><td background="img/right.png" width=14></tr></td></table> </tr></td></table> </body></html> CSS Code: body { font-style: normal; font-variant: normal; font-weight: normal;
font-size: 12px;
font-family: Tahoma, Arial; background-color: #0F0F0F;
color:
#424242; background: url(img/damask.png);
background-attachment:
fixed; background-repeat: repeat; margin-bottom: 0px; vertical-align:
bottom;}
table { color: #424242; font: 11px Tahoma, Arial; margin: 0px;
}
sm {font-size: 0.9em; }
a:link { color: #424242; }
a:visited { color: #595959; }
a:hover { color: #424242; text-decoration:none; }
a:active { color: #424242; }
What I would, ideally, like to have is for the box to take a percentage of space. Say, vertically 80 or 90%, and then a blank remainder on the top. Horizontally, say, 10 or 15% on either side and then 70 or 80% for the "box." But, google as I might, I just can't find the right CSS commands to do it. It just gets funny looking and shrinks all my border images (Though I erased the code that caused that). http://www.kafadrian.com/juggernaut/index.html is what i have so far I want it to look like: http://www.kafadrian.com/juggernaut/layout.jpg The problem im having is that the image links that have mouseover effects dont align (touch) the blue bar below them and apparently in some browsers the image links themselves have gaps between them I spent hours, and yes im relatively noobish about all this, trying all sorts of different display commands and border/margin commands to try and get rid of any spaces, the way the site is now (10.01.08) is the best i could get it. in IE7 the mouseover images connect horizontally but not vertically with other images. am i going about this all wrong? my experience in building websites is mostly from the early eras of netscape when IE was new, back when you put stuff in a table a certain way with no cellpadding/spacing/border and everything aligned no problem. I appreciate any help with this as I undertand it will take time to give me an answer that no only makes sense (to me) but will work. the code for the site is: 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>Juggernaut - Monolith - Order</title>
</head>
<body marginheight="0" marginwidth="0" leftmargin="0" rightmargin="0" topmargin="0">
<script type="text/javascript">
<!--
var image1 = new Image();
image1.src = "news1.jpg";
var image2 = new Image();
image2.src = "news2.jpg";
var image3 = new Image();
image3.src = "news3.jpg";
var image4 = new Image();
image4.src = "roster1.jpg";
var image5 = new Image();
image5.src = "roster2.jpg";
var image6 = new Image();
image6.src = "roster3.jpg";
var image7 = new Image();
image7.src = "forums1.jpg";
var image8 = new Image();
image8.src = "forums2.jpg";
var image9 = new Image();
image9.src = "forums3.jpg";
var image10 = new Image();
image10.src = "files1.jpg";
var image11 = new Image();
image11.src = "files2.jpg";
var image12 = new Image();
image12.src = "files3.jpg";
var image13 = new Image();
image13.src = "info1.jpg";
var image14 = new Image();
image14.src = "info2.jpg";
var image15 = new Image();
image15.src = "info3.jpg";
var image16 = new Image();
image16.src = "founded.jpg";
//-->
</script>
<script type="text/javascript">
<!--
function roll(img_name1, img_src1, img_name2, img_src2)
{
document[img_name1].src = img_src1;
document[img_name2].src = img_src2;
}
//-->
</script>
<table border="0" cellspacing="0" cellpadding="0" style="margin:0">
<tr height="34">
<td rowspan="4">
<img style="display:block" src="juggernaut.jpg" width="560" height="110"/>
</td>
<td>
</td>
</tr>
<tr>
<td>
<a href="index.html" style="display:inline-block"
onmouseover="roll('news','news2.jpg','text','news3.jpg')" onmouseout="roll('news','news1.jpg','text','founded.jpg')">
<img style="display:inline-block" src="news1.jpg" name="news" width="48" height="48" border="0"/>
</a>
<a href="index.html" style="display:inline-block"
onmouseover="roll('roster','roster2.jpg','text','roster3.jpg')" onmouseout="roll('roster','roster1.jpg','text','founded.jpg')">
<img style="display:inline-block" src="roster1.jpg" name="roster" width="48" height="48" border="0"/>
</a>
<a href="index.html" style="display:inline-block"
onmouseover="roll('forums','forums2.jpg','text','forums3.jpg')" onmouseout="roll('forums','forums1.jpg','text','founded.jpg')">
<img style="display:inline-block" src="forums1.jpg" name="forums" width="48" height="48" border="0"/>
</a>
<a href="index.html" style="display:inline-block"
onmouseover="roll('files','files2.jpg','text','files3.jpg')" onmouseout="roll('files','files1.jpg', 'text','founded.jpg')">
<img style="display:inline-block" src="files1.jpg" name="files" width="48" height="48" border="0"/>
</a>
<a href="index.html" style="display:inline-block"
onmouseover="roll('info','info2.jpg','text','info3.jpg')" onmouseout="roll('info','info1.jpg','text','founded.jpg')">
<img style="display:inline-block" src="info1.jpg" name="info" width="48" height="48" border="0"/>
</a>
</td>
</tr>
<tr>
<td>
<img style="display:block" src="line_right.jpg" width="240" height="4"/>
</td>
</tr>
<tr>
<td>
<img style="display:block" src="founded.jpg" align="right" name="text" width="144" height="20"/>
</td>
</tr>
</table>
</body>
</html>
I'm trying to reduce the amount of real estate that a form and button are taking up in my table. They are expanding the whole row and lining them up with the other contents isn't working in the CSS methods I've tried. Finally I tried reduce the font-size of the cell containing the form and button (all the way down to 1px) which gives the desired result... but I'm a bit concerned about implementing it into all the tables in the site because it seems a bit 'hacky'. Is there a better way to do this? My Webpage You'll see in the first table, final column containing the button, that the button and form and pushed up against the top of the cell and the other cells now have more padding. In the second table, my "font-size:1px" has been applied and gives the desired result. Just curious if there is a better way to do this or if this is will be fine. Please see here http://www.challengeyourdiet.com/te...etail.php?id=13 If you look at the table, you will see one of the borders toward the bottom of it slightly breaking. I cannot figure out for nothing what is causing this. Any ideas? Also, a different issue, if you shrink your browser and then scroll to the right you will see the text and things out of place. Is this a min-width issue? Thanks! I use Code: .list_table {
border: 1px solid #BDC2C6;
border-collapse:collapse;
}
.list_table tr{
border: 1px solid #BDC2C6;
border-collapse:collapse;
}
but TR borders registers only in FF, what's with the IE? Hello all, I'm a copywriter who's recently been forced into web design by my boss because of general tech savvy. I've replaced his old ugly website with a new, prettier one. I would post a url but it says I'm a new user and I can't - I don't know when that ban gets lifted. I did the layout with a table which I KNOW is incorrect and will make further development difficult, but my boss insisted and I don't feel too bad about it as this really isn't what I'm being paid for. (If he wants a correct, professionally designed website he can hire a professional web designer to do it correctly). However, there is one issue I'd like to fix, if I can. On the second, third and fourth pages (What Vehicles We Buy, FAQs, and Why Sell to Auto Buyer?) the table sizes incorrectly in IE 8 - but not in Firefox, Chrome or any phone I've been able to check it on. If you can open it in IE you should see what I'm talking about. Right off the bat, the navigation bar near the top is too low, and it gets worse the farther you get down the page. The images in the middle are way off. This is only the case on these three pages, all the site's other pages are fine. I'm at a loss on how to fix it. If I need to post the full code for you to see, I can do that but I don't want to clutter this post if it's not necessary. Here's the style codes for the background image and the table, respectively: #bg { vertical-align: top; width: 1601px; position: absolute; top: 0; left: 0; } #Table_01 { vertical-align: top; width: 1601px; position: absolute; top: 0; left: 0; } If anyone can see why I'm having a problem, I'd be extremely grateful. Thanks in advance. Hello Dev Shed, I am having a problem aligning my tables inside thier respective column div's to the center. Here is the css sheet in question. Code: body {
font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
background:#FFF;
margin:0;
padding:0;
}
td {
font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
}
th {
font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
}
#container {
margin-top:0px;
padding-top:0px;
width:1024px;
margin-left:auto;
margin-right:auto;
background:#FFF;
}
#header {
width:1024px;
height:100px;
background:url(../images/headerbg.jpg);
text-align:right;
color:#bce9c3;
font-weight:bold;
}
#header h1 {
color:#FFF;
margin:0;
padding:0;
font-size:xx-large;
padding-top:10px;
padding-right:5px;
}
#header p {
margin:0;
padding:0;
padding-right:5px;
}
#content {
width:1024px;
background:#a3e1ad;
}
#leftcol {
padding-top:10px;
float:left;
width:512px;
background-color:#a3e1ad;
text-align:center;
}
#rightcol {
padding-top:10px;
float:left;
width:512px;
background-color:#a3e1ad;
text-align:center;
}
#content table {
border-width:4px;
border-spacing:0px;
border-style:solid;
border-color:#168cf7;
border-collapse:collapse;
}
#content td.title {
background-color:#FFF;
}
#content td.title p {
color:#168cf7;
font-weight:Bold;
text-align:Center;
}
Even though both leftcol and rightcol have text-align set to center, they're still both aligning to the left. Any help would greatly be apprieciated. Thanks in advance. I'm having some issues with getting a table border to appear in both Mozilla and IE. I had it working at one point but now it's stopped working in IE. Basicly this is the code to control it: border:1px solid #0; but IE doesn't read it, I've checked the rest of the CSS to see if there is any conflicts but found none. Anyone know how to get the table border to appear in both IE and Mozilla? using css i've got a table in a div: e.g. div padding: 20px table width: 540px border: 10px solid red; result: the div including it's own padding should be 600px wide but using the html strict dtd ie is in strict mode (confirmed by other measurements) the whole width of the table is 540px including the borders. also setting box-sizing to contents . thoughts? Something like this gives real thick and uneven borders, is it possible to make the borders combine and become one single border when they are next to each other? I don't want to use seperate border-top border-left etc ... Thank you. Code:
<HTML>
<HEAD>
<style type="text/css">
div.table div
{
border : 1px solid black;
/* border-collapse : collapse; */
}
div.table div.tr
{
clear : both;
}
div.table div.tr div.th
{
float : left;
font-weight : bold;
width : 25%;
}
div.table div.tr div.td
{
float : left;
width : 25%;
}
</style>
</HEAD>
<BODY>
<div class="table">
<div class="tr">
<div class="th">column 1</div>
<div class="th">column 2</div>
<div class="th">column 3</div>
<div class="th">column 4</div>
</div>
<div class="tr">
<div class="td">num 1</div>
<div class="td">num 2</div>
<div class="td">num 3</div>
<div class="td">num 4</div>
</div>
<div class="tr">
<div class="td">numAAA 1</div>
<div class="td">numA 2</div>
<div class="td">numAAAA 3</div>
<div class="td">num 4</div>
</div>
<div class="tr">
<div class="td">num 1</div>
<div class="td">num 2</div>
<div class="td">num 3</div>
<div class="td">num 4</div>
</div>
<div class="tr">
<div class="td">num 1</div>
<div class="td">num 2</div>
<div class="td">num 3</div>
<div class="td">num 4</div>
</div>
</div>
</BODY>
</HTML>
I have a table that is populated using Spry. For some of the users, the table is showing its' borders in white when there is no data in the cell and for other users (like me) it's showing its' borders in black like expected. This is occurring in IE8 for the user. I have IE8 as well. Here is a setup of my table Code: <div id="Content">
<p class='instructions'>Click a column header to sort the table.</p>
<div spry:region="jdmba">
<div spry:state="loading" class="loading">Please wait while alumni data loads…</div>
<table class="spry" cellspacing="0" cellpadding="0">
<tr>
<th scope="col" width="108px" class="sortable" spry:sort="last" id="last">Last Name</th>
<th scope="col" width="106px" class="sortable" spry:sort="first" id="first">First Name</th>
<th scope="col" width="269px" class="sortable" spry:sort="account" id="account">Company</th>
<th scope="col" width="66px" class="sortable" spry:sort="state" id="state">State</th>
<th scope="col" width="82px" class="sortable" spry:sort="hls_year" id="hls_year">JD</th>
<th scope="col" width="82px" class="sortable" spry:sort="hbs_year" id="hbs_year">MBA</th>
</tr>
</table>
<div class="Overload">
<table class="spry" cellspacing="0" cellpadding="0">
<tr spry:repeat="jdmba" spry:setrow="jdmba" spry:odd="odd" spry:even="even" spry:hover="hover" >
<td width="108px">{last}</td>
<td width="106px">{first}</td>
<td width="269px">{account}</td>
<td width="66px">{state}</td>
<td width="82px">{hls_year}</td>
<td width="82px">{hbs_year}</td>
</tr>
</table>
</div>
</div>
Here is my CSS file Code:
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
#News a:link {
color: #00F;
}
#News a:hover {
color: #00F;
text-decoration: underline;
}
body {
background: #000 repeat;
}
#wrap {
background: #000;
width: 900px;
border: thick solid #9C0029;
float: left;
height: auto;
padding: 0px 0px 1em;
margin-top: 2%;
margin-left: 10%;
}
#footer {
font: bold small/50px Arial, Helvetica, sans-serif;
color: #FFF;
background: #9C0029;
text-align: center;
height: 50px;
width: 850px;
margin-left: 25px;
}
#Header {
background: #8F001C url(../images/banner.jpg) no-repeat center center;
width: 850px;
height: 150px;
margin-top: 20px;
margin-right: 20px;
margin-left: 25px;
}
h1 {
font: normal 18px Arial, Helvetica, sans-serif;
color: #000;
text-align: left;
}
h2 {
font: small Georgia, "Times New Roman", Times, serif;
color: #333;
text-align: justify;
}
h3 {
font: normal medium "Times New Roman", Times, serif;
color: #FFF;
}
h4 {
font-size: small;
color: #333;
text-align: left;
}
.banners {
background: #FFF0B2;
width: auto;
height: auto;
font: 18px Arial, Helvetica, sans-serif;
padding-top: .5em;
padding-bottom: .5em;
text-indent: 10px;
}
.Content {
font: 14px/normal Georgia, "Times New Roman", Times, serif;
text-align: justify;
display: block;
padding: 2em 3em 3em;
}
.Content a:link {
color: #00F;
}
.Content a:hover {
color: #00F;
text-decoration: underline;
}
.Content a:visited {
color: #00F;
}
#inner_body {
background: #FFF;
height: auto;
width: 800px;
margin-top: 0px;
margin-left: 50px;
padding-top: 0.5em;
padding-bottom: .5em;
}
#inner_border {
margin: 0em auto auto;
border: thin solid #8E887C;
width: 775px;
padding: 1em 0em 0em;
}
#nav_bar {
height: 3em;
width: 100%;
margin-left: 0%;
text-align: center;
}
#Content {
height: auto;
width: 95%;
padding: 0em 0% 5em;
margin: 2.5% 2.55% 2%;
text-align: left;
font-family: Verdana;
}
#nav {
height: auto;
width: 20em;
}
#News {
margin-left: 2px;
height: 30%;
background: #FFF0B2;
padding: 3%;
}
#News a:visited {
color: #00F;
}
.Overload
{
height: 208px;
overflow: auto;
}
.odd { background-color: #E8E8E8; }
.even { background-color: #E8E8E8;}
.hover { background-color: #FFC;}
table.spry {
font-family: Verdana;
font-size: 12px;
line-height:20px;
cursor: pointer;
}
.instructions {
font-family: Verdana;
font-weight:bold;
font-size: 12px;
line-height:20px;
cursor: pointer;
margin-bottom:8px;
}
.loading {
font-family: Verdana;
font-weight:bold;
font-size: 12px;
line-height:20px;
cursor: pointer;
margin-top:0px;
margin-bottom:8px;
color:#900;
}
table.spry th {
border-left: 1px solid #000000;
border-bottom: 1px solid #000000;
border-top: 1px solid #000000;
font-family:Verdana;
padding: 0px;
margin: 0px;
}
table.spry td {
border-left: 1px solid #000000;
border-bottom: 1px solid #000000;
font-family:Verdana;
padding: 0px;
margin: 0px;
}
table.spry th.sortable:hover { cursor: pointer; }
table.spry th.sortable { text-align:left; color:#FFFFFF; background: #8F001C url(../SpryAssets/bg.gif) no-repeat 95% 6px; }
table.spry th.ascending { background: #8F001C url(../SpryAssets/SpryMenuBarUpHover.gif) no-repeat 95% 8px; }
table.spry th.descending { background: #8F001C url(../SpryAssets/SpryMenuBarDownHover.gif) no-repeat 95% 8px; }
I'm only placing borders on the left and bottom so that in my detail cells the borders aren't doubled up. So for example when I have no data for the cell State, the left and bottom border of that cell is white rather than black. Any ideas? Thanks! Hi everyone, I am having trouble aligning my content to the edge of the table somehow it shows 20pixels down and I cann't figuere out how to bring it up. Any help will be greatly appreciate. thanks Code:
<style>
ul { list-style-type: none; margin: 1.0em 0 0 0px; padding: 0; position:relative; overflow: visible; height: auto; text-decoration: none; color: #33FF00;}
ul li { text-decoration: none; width: 230px; color: #000; }
ul li a, ul li a:visited {height: 1.2em; width: 200px; display: block; text-decoration: none; background: blue; margin: 0.1em 0 0 0; text-indent: 10px; padding: 3px; color: #000;}
ul li a:hover { height: 1.2em; display: block; background-color:#FF0000; color: #fff000;}
ul li a.currentpage, ul li { height: 1.2em; text-decoration: none; background: #00ffff; padding: 3px; color: #fff;}
</style>
<table width="234" border="1">
<tr>
<td width="230" height="85">
<ul><li><a href="">HOME</a></li>
<li><a href="">LINK TWO</a></li>
</ul>
</td>
</tr>
<tr><td></td></tr>
</table>
After browsing through w3schools and learning most of what css has to offer I for some reason can't figure out a way to align items using css. I was just wondering if someone could help me with the correct tag. Hi I have an issue aligning some links. i have it perfect in FF but it is not the same in IE. http://www.sun-awnings-direct.co.uk/the-carino-p-29.html It is the white breadcruumb trail in question. Can anyone advise what IE is doing differently and how I can solve it? Thanks a lot www.devwebsites.com/index.php is my site. in order to view this problem you must register at www.devwebsites.com/register.php Once you do go back to the home page and you will see the ul out of the login box. Any help is greatly appreciated. Tell me what I should do to fix it please. CSS LINK http://www.devwebsites.com/estilos.css |
|||||||