HTML - Navigation Bar - Aligning Problems
I'm trying to make a navigation bar that has the buttons taking up the full height of the container it is in, and have a width with just a few pixels padding on each side.
Full height problem: I added this code: Code: ul#nav li { height: 100%; } but it only takes up as much as the padding takes up. Padding problem: When I add padding/margin on the top, instead of bumping the actual navigation button down, it overflows on the top and so there is a little green square sticking out. I want it to be perfectly centered inside the container. Please help! Thanks. Similar TutorialsFor some reason the rollover navigation isn't aligning with the rest of my header images. Firefox and Safari - No good. IE 7 - ok. LINK TO PAGE Does anyone see what wrong in my code? Hello there i have just created a simple website using div tags as layers to position link elements on the page. I have 2 pages the first page has an image link that takes the user to the second page and the image link has been aligned in a div tag to position it onto the screen. When i test the first page in most browsers the aligning seems to be perfect and is aligning well in all browsers. The problem im facing is on the second page, i have done exactly the same procedure to align a form element and an image link but when published and previewed in safari it is aligned perfectly but in most other browsers the div aligning for the form and the image link are not aligned at all. i cant figure out this problem because the first page is done exactly the same way and that works in all browsers, could someone please please have a look for me its probably something really simple but i cant see it. Below is the source code for both page 1 with the aligning in all browsers image link, and the second page the one that needs to be positioned correctly in all browsers: (PAGE 1 THE IMAGE LINK ON THIS PAGE ALIGNS CORRECTLY IN ALL BROWSERS AND IS FIN) <HTML> <HEAD> <TITLE>HARMONIC WEBSITE p1guides</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> </HEAD> <BODY BGCOLOR="BLACK" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 > <div align="center"> <div style="background-image:url('Background.jpg'); width:1024px; height:768px; background-repeat: no repeat; z-index: 0;"> <div style="z-index: 1; align: right; padding-top: 517px; padding-left: 273px;> <a href="index.html></a> <a href="page2.html"><IMG SRC="images/index_19.jpg" BORDER=0 WIDTH=219 HEIGHT=44 ALT=""></a> </div> </div> </div> </BODY> </HTML> (PAGE 2 THE FORM AND IMAGE LINKS ARE POSITIONED EXACTLY THE SAME AS PAGE 1 BUT APPEAR TO BE OUT OF POSITION IN DIFFERENT BROWSERS?) <HTML> <HEAD> <TITLE>HARMONIC WEBSITE p2guides</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> </HEAD> <BODY BGCOLOR=#000000 LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0> <!-- ImageReady Slices (HARMONIC WEBSITE p2guides.psd) --> <BODY BGCOLOR="BLACK" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 > <div align="center"> <div style="background-image:url('Backgroundp2.jpg'); width:1024px; height:768px; background-repeat: no repeat; z-index: 0;"> <div style="z-index: 1; padding-top: 260px; padding-left: 700px;> <TABLE WIDTH=328 BORDER=0 CELLPADDING=0 CELLSPACING=0 > <TD IMG SRC="form background.jpg" WIDTH=328 HEIGHT=248 BORDER=1 ALIGN="LEFT"> <form action="mailto:YOUR EMAIL ADDRESS" method="post" enctype="text/plain" border=0 > <br> <input type="text" name="name" value="" size="30"> <br><br> <input type="text" name="Position/primary specialty" value="" size="30"> <br><br> <input type="text" name="Number of patients treated" value="" size="5"> <br><br> <input type="text" name="Hospital" value="" size="30"> <br><br> <input type="text" name="Email address" value="" size="25"> <br><br> <a href="page3.html"> <input type="submit" value="Send"> <a> <input type="reset" value="Reset"> </form> </TD> </div> <div style="z-index:2; padding-top: 66px; padding-left: 520px; margin-top: 0px;> <a href="index.html></a> <A HREF="http://www.harmonic.com"> <IMG SRC="p2-click_15.jpg" BORDER="0" WIDTH=46 HEIGHT=21 ALT=""></A> </div> </div> </BODY> </HTML> Could somebody help me out in trying to put a separate image beside a table? Every time I try it the image ends up below the table rather than next to it. The table is surrounding a song lyric box. I want to put an image (of Ellla Fitgerald) beside the table. The image has a border that looks like the table. The combinded width of table and image is around 520px and I want about a 20px space between the two. That's a total width of 540px. It's to go on my LJ profile page. I fairly sure that's not too wide for the page. The code for the table and a screenshot of table/lyric box is below. The image that I'm trying to put next to it is: The outcome that I'm looking for is: Thanks in advance. hey, simple question here i just cant get it to work though. i want to align some text to the bottom and to the right of a table <table width="100%" cellspacing="0" border="0" cellpadding="18" height="75%"> <tr> <td bgcolor="000000" width="10%"> <img src="graphics/spacer.gif" width="100" height="1"> </td> <td bgcolor="ffffff" width="90%" valign="top"> <h2>Welcome to the Darwin Soccer Clubs Official Website</h2> <hr color="black"> <p>Here we strive to bring you all the latest news from the club by keeping you updated on the results from all our games throught out the season, the roster so you will never forget when your teams, where your teams playing and who there playing. <br><br> Also check out the new <a href="p4potw.html">Player of the week</a> page to see if you have made it to number one!</p> <p align="right" valign="bottom"> THIS IS THE PART I CANT GET TO WORK</p> </td> </tr> i dont no why.. and try not to think about the other writing in the table this is for my studies i am doing. cheers </table> Hello, I am trying to figure out why I am having a problem with a drop-menu in Internet Explorer 6. The site I am currently working on is at http://www.falcolombardi.net/Saint%20Anne/. It appears fine in FireFox, but I am needing it to work in Internet Explorer as well. There is only one element that is needing to drop, and that's a 'Newsletter' option under the "Perish Life" link. Any help is greatly appreciated! Hi, I'm in high school and need a website for my "up-and-coming" YouTube channel. I've already finished two months of a basic Web Design class and we've just made the switch from HTML coding to Dreamweaver (but I use HTML for what I'm doing). Anyway, I know some stuff but am still pretty new and having minor difficulties with my navigation bar. I can get the links but I can't get the actual "bar" to form. I've already designed the site in OpenOffice.org (alternative for Microsoft Publisher) The link can be found on my YouTube channel's Facebook page. The image's URL is he https://www.facebook.com/photo.php?f...0634082&type=3 The link to the screenshot of my problem (includes web browser and code in the image) is he https://www.facebook.com/photo.php?f...0634082&type=3 Thanks in advance - Brad I cannot work out why my google ads on the left hand side of my pages appear vertically centred, and not aligned to the top. The site is here My code looks like this: <td valign="top"> <p align="center"> {include file="$tpl_dir/ads_left_two.sec.html"} <img src="images/120-pixel-spacer.gif" alt="richmond upon thames" width="120" height="20" /></p></td> and the code for {include file="$tpl_dir/ads_left_two.sec.html"} looks like this: {literal} <script type="text/javascript"><!-- google_ad_client = "pub-2556340643393239"; google_alternate_color = "598527"; google_ad_width = 120; google_ad_height = 600; google_ad_format = "120x600_as"; google_ad_type = "text"; google_ad_channel ="6678563867"; google_color_border = "CCCCCC"; google_color_bg = "FFFFFF"; google_color_link = "790000"; google_color_text = "333333"; google_color_url = "598527"; //--></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> <script type="text/javascript"><!-- google_ad_client = "pub-2556340643393239"; google_alternate_color = "598527"; google_ad_width = 120; google_ad_height = 600; google_ad_format = "120x600_as"; google_ad_type = "text"; google_ad_channel ="7752161831"; google_color_border = "CCCCCC"; google_color_bg = "FFFFFF"; google_color_link = "790000"; google_color_text = "333333"; google_color_url = "598527"; //--></script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> {/literal} Hopefully i'm doing something dumb and you can tell me!!! I've been trying to work this out for ages.... thanks Bugs1012 Hello, I ran into this problem today in my Basic XHTML class, and it was enough to stump me and the instructor: if you want to put an unordered list in the middle of a page, but you want the list items to be left-aligned so the bullets are one on top of the other...how do you do it? I started with code something like <div align="center"> <ul type="disc"> <li>Wine</li> <li>Women</li> <li>Song</li> </ul> </div> This centers the list on the page, but it also centers each list item. I tried placing a <div align="left"> around the list items, individually and collectively, but depending on the positioning it either had no effect or it nullified the center attribute completely and gave me a left-aligned list on the left edge of the page. Attempts to change the style of the <li> tag, which I haven't done in months and was never all that good at, failed. I know I can do this in ten seconds by putting the list inside a one-cell table, and with much fiddling I could probably do it with a spacer GIF...but what's the 1.0 Strict way? this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html there are several things I would like to happen. 1. the right collumn background to be where the right collumn should be(so other links in navbar) 2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see) 3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does. 4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle. 5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns? don't worry about the colors I will be changing them soon I have a form i am creating for a widget to put on my website but for some reason it does not align all the way to the left instead it is off center. How do i put it to the far left? And then there is a random box that appears in the top, how do I remov this? Thank you HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <input> </head> <body> <form id="form1" action="https://app.realeflow.com//api/contactSubmit.aspx?id=35151&type=1&ar=30178" method="post" name="form1"> <script type="text/javascript">// <![CDATA[ function numbersonly(myfield, e, dec) { var key; var keychar; if (window.event) key = window.event.keyCode; else if (e) key = e.which; else return true; keychar = String.fromCharCode(key); if ((key == null) || (key == 0) || (key == 8) || (key == 9) || (key == 13) || (key == 27)) return true; else if ((("0123456789").indexOf(keychar) > -1)) return true; else if (dec && (keychar == ".")) { myfield.form.elements[dec].focus(); return false; } else return false; } // ]]></script> <div id="seller_opt" class="optin" style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 0pt; WIDTH: 477px; PADDING-RIGHT: 0pt; BACKGROUND: url(http://www.ibuyhousesinsanantonio.com/wp-content/uploads/2012/01/Untitled.png) no-repeat 0pt 50%; HEIGHT: 481px; PADDING-TOP: 55px; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial"> <p class="text" style="PADDING-BOTTOM: 0pt; MARGIN: 2px; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; FONT: 13px Arial,Helvetica,sans-serif; COLOR: rgb(0,0,0); PADDING-TOP: 0pt; font-size-adjust: none; font-stretch: normal" >Name:</p> <div style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; PADDING-TOP: 0pt"> <input id="SellerWizard_ownerName" style="BORDER-BOTTOM: rgb(0,0,0) 1px solid; BORDER-LEFT: rgb(0,0,0) 1px solid; PADDING-BOTTOM: 2px; MARGIN: 0pt 0pt 2px; PADDING-LEFT: 2px; WIDTH: 155px; PADDING-RIGHT: 2px; FONT: 13px Arial,Helvetica,sans-serif; HEIGHT: 22px; COLOR: rgb(88,88,88); BORDER-TOP: rgb(0,0,0) 1px solid; BORDER-RIGHT: rgb(0,0,0) 1px solid; PADDING-TOP: 2px; font-size-adjust: none; font-stretch: normal" name="SellerWizard$ownerName" maxlength="100"> </div> <p class="text" style="PADDING-BOTTOM: 0pt; MARGIN: 2px; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; FONT: 13px Arial,Helvetica,sans-serif; COLOR: rgb(0,0,0); PADDING-TOP: 0pt; font-size-adjust: none; font-stretch: normal" >E-mail Address:</p> <div style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; PADDING-TOP: 0pt"> <input id="SellerWizard$ownerEmail" style="BORDER-BOTTOM: rgb(0,0,0) 1px solid; BORDER-LEFT: rgb(0,0,0) 1px solid; PADDING-BOTTOM: 2px; MARGIN: 0pt 0pt 2px; PADDING-LEFT: 2px; WIDTH: 155px; PADDING-RIGHT: 2px; FONT: 13px Arial,Helvetica,sans-serif; HEIGHT: 22px; COLOR: rgb(88,88,88); BORDER-TOP: rgb(0,0,0) 1px solid; BORDER-RIGHT: rgb(0,0,0) 1px solid; PADDING-TOP: 2px; font-size-adjust: none; font-stretch: normal" onkeydown="arrowKeyNavigate(this);" name="SellerWizard$ownerEmail" maxlength="100"> </div> <p class="text" style="PADDING-BOTTOM: 0pt; MARGIN: 2px; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; FONT: 13px Arial,Helvetica,sans-serif; COLOR: rgb(0,0,0); PADDING-TOP: 0pt; font-size-adjust: none; font-stretch: normal" >Zip Code:</p> <div style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; PADDING-TOP: 0pt"> <input id="SellerWizard$ownerZip" style="BORDER-BOTTOM: rgb(0,0,0) 1px solid; BORDER-LEFT: rgb(0,0,0) 1px solid; PADDING-BOTTOM: 2px; MARGIN: 0pt 0pt 2px; PADDING-LEFT: 2px; WIDTH: 155px; PADDING-RIGHT: 2px; FONT: 13px Arial,Helvetica,sans-serif; HEIGHT: 22px; COLOR: rgb(88,88,88); BORDER-TOP: rgb(0,0,0) 1px solid; BORDER-RIGHT: rgb(0,0,0) 1px solid; PADDING-TOP: 2px; font-size-adjust: none; font-stretch: normal" onkeydown="arrowKeyNavigate(this);" name="SellerWizard$ownerZip" maxlength="15"> </div> <p class="text" style="PADDING-BOTTOM: 0pt; MARGIN: 2px; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; FONT: 13px Arial,Helvetica,sans-serif; COLOR: rgb(0,0,0); PADDING-TOP: 0pt; font-size-adjust: none; font-stretch: normal" >Mobile Phone*:</p> <div style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; PADDING-TOP: 0pt"> <input id="SellerWizard$ownerMobilePhone" style="BORDER-BOTTOM: rgb(0,0,0) 1px solid; BORDER-LEFT: rgb(0,0,0) 1px solid; PADDING-BOTTOM: 2px; MARGIN: 0pt 0pt 2px 0px; PADDING-LEFT: 2px; WIDTH: 155px; PADDING-RIGHT: 2px; FONT: 13px Arial,Helvetica,sans-serif; HEIGHT: 22px; COLOR: rgb(88,88,88); BORDER-TOP: rgb(0,0,0) 1px solid; BORDER-RIGHT: rgb(0,0,0) 1px solid; PADDING-TOP: 2px; font-size-adjust: none; font-stretch: normal" onkeypress="return numbersonly(this, event)" name="SellerWizard$ownerMobilePhone" maxlength="25"> </div> <div style="PADDING-BOTTOM: 0pt; PADDING-LEFT: 100px; PADDING-RIGHT: 0pt; PADDING-TOP: 0pt"> <input id="SellerWizard_FinishNavigationTemplateContainerID_FinishButton" class="submit" style="MARGIN: 0pt 0pt 0pt 25px" onclick='javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("SellerWizard$FinishNavigationTemplateContainerID$FinishButton", "", true, "", "", false, false))' name="SellerWizard$FinishNavigationTemplateContainerID$FinishButton" value="Finish" src="http://api.ning.com/files/2FjYylCa-7----tgtm1C84N-wASg37E3PmRpOeW5GET9uz4-SqDzfp9Xn7pslOJrglrucDsLut3pJXluZymZKd-mGJj0vi26/submitbutton.jpg" type="image"><br> *Optional </div> </div> </form> <br> </body> </html> You can see where it doesnt align on the website and another view of it not being where it is suppose to be in an html editor, thanks for any help! Hey, im not too experienced with web design but me and a friend decided to go on an wing and try and make a flash game web page. Everything been going great till i tried adding a add to the top left of the page. Only thing i could do is set an absolute value to the div but it dose not look right in smaller resolutions. Example script: <div style="text-align: left; position: absolute;"> <!-- Begin BidVertiser code --> <script language="JavaScript1.1" src="http://bdv.bidvertiser.com/BidVertiser.dbm?pid=141137&bid=341700" type="text/javascript"></script> <noscript><a href="http://www.bidvertiser.com/bdv/BidVertiser/bdv_advertiser.dbm">internet advertising</a></noscript> <!-- End BidVertiser code --> </div> <div style="text-align: center;"><a href="http://pinkkittens.org/"><img alt="Banner" src="http://pinkkittens.org/images/pinkkittenbannernew.png" style="border: 0px solid ; width: 815px; height: 121px;" align="top"></a></div> <div id="flashcontent" style="text-align: center;"></div> <script type="text/javascript">var so = new SWFObject("http://pinkkittens.org/upward.swf","upward","815","35","8","#FF88B8"); so.addParam("allowScriptAccess","always"); so.write("flashcontent");</script> I want the banner in the middle...the navigation bar right under it and also the ad on the far left...but could only achieve this with a absolute value...any pointers? Web address for better viewing pleasure is http://www.pinkkittens.org/ How would i go about aligning everything on a page so instead of starting on the very left of the page, it starts X amount of pixels away from the side? Also how can i adjust the space between each line of text? Make it a bit wider or smaller..etc So I'm working on a <dl> and using this bit of code as an example: <style type="text/css">dl{ border: 3px double #ccc; padding: 0.5em; } dt { float: left; clear: left; width: 100px; text-align: right; font-weight: bold; color: green; background-color:yellow;} dt:after { content: ":"; } dd { margin: 0 0 0 110px; padding: 0 0 0.5em 0; } </style> <dl> <dt>first item</dt> <dd>definition for first item in list</dd> <dt>second item</dt> <dd>definition for second item in list<br> extending across more than one line</dd> <dt>third item</dt> <dd>definition for third item in list</dd> </dl> That bit works exactly like you'd expect it to. However, when I apply it to my own list I run into a problem and i can't see the problem. Here's the link to my page: http://site.outletpccomputerrepair.c...opups/test.htm whenever I have a second line of <dd>, the alignment messes up. I can't see what to do in order to get the <dd> elements to align properly whenever there's a second line. Please help! I have a HTML file with two pictures on. They are like title lines. I need the one to be pushed right up to the top-left, and the other one to strech all the way across. I have a screenshot: http://img80.imageshack.us/img80/6827/screenshotjs.png Have a look. The lines are two pictures, they are split close to the middle. Hi I am new to this site and very new to html. I just know the basics. My problem is, is there a way to make 1 line of text be split for example have 1 part of the line be aligned to the left and the other to the right. Here is an example, the first part is what is actually happening and the second part is the way i want it to look. This is an example.This is an example This is an example. This is an example. I just realized that my second part of the example didnt come out the way i wanted. So i want the second part to have the first part aligned to the left and the second part aligned to the right. Please help. Its probably really easy but like i said i just know the basics. Thanks in advance for any help that is given Mike hi all, i have set a page up using iframes as it was originally created using authoring software to allow me to create a menu (this menu did not function correctly with regular frames) I have adapted the code to make the frames appear ALMOST as i want but there is a gap between the lower two frames. This only occurs in firefox but is very annoying and i need help to remove it. The section of code i am using to create the frames is as follows. Code: <html> <iframe name="TopFrame" id="InlineFrame1" left="0%" top="0%" width="95%" height="15%" style="z-index:1" src="./top.html" scrolling="no" frameborder="0">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe> <iframeset border="0" frameborder="0" framespacing="0"> <iframe name="LeftFrame" id="InlineFrame2" width="15%" height="80%" style="z-index:2" src="./left.html" scrolling="no" frameborder="0" framespacing="0">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe> <iframe name="MainFrame" id="InlineFrame3" width="80%" height="80%" style="z-index:3" src="./main.html" scrolling="no" frameborder="0" framespacing="0">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe> </iframeset> </html> Any help would be greatly appreciated. Thanks Dave I created a table with about 100 rows down in Dreamweaver. Anyways I want to align a few pictures to the left of the table. Everytime I add the picture it places it above the table. I tried using every code I can think of to align it to the left but it will not go to the left, any advice? Dear readers, I am working on the Schools web page and I require some help. I have created a 'navagational menu bar' and i am having trouble aligning it in the center of the page no matter what the resolution of the screen is. Here is the coding: Code: <DIV ID="MainMenu"> <div id="MenuMain"> <!--Main Buttons --> <div id="menu"> <a href="general/psmenu.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_0', 'Menu_0',0,28,'ParentsStudents');"><img src="images/schoolmenu.png" alt="Festus School" border="0" /></a><a href="general/employeemenu.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_1', 'Menu_1',0,28,'Employees');"><img src="images/aboutmenu.png" alt="About FHS" border="0" /></a><a href="schools/index.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_2', 'Menu_2',0,28,'Schools');"><img src="images/psmenu.png" alt="Parents & Students" border="0" /></a><a href="depts/index.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_3', 'Menu_3',0,28,'Departments');"><img src="images/facultymenu.png" alt="Faculty" border="0" /></a><a href="publications/index.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_4', 'Menu_4',0,28,'Publications');"><img src="images/curricularmenu.png" alt="Extra-Curricular" border="0" /></a><a href="board/index.htm" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MenuContainer_5', 'Menu_5',0,28,'Board');"><img src="images/newsmenu.png" alt="News" border="0" /></a> </div> Here is the CSS: Code: #MenuMain { /* The master div to make sure that our popup menus get aligned correctly. Be careful when playing with this one. */ position:relative; margin:0px; text-align:left; width: 100%; } #MenuContainer_0 { /* This ID is related to the master menu div for menu MenuContainer_0 and contains the important positioning information for the menu as a whole */ position:absolute; left:500px; top:45px; z-index:300; visibility: visible; } #Menu_0 { /* This class defines things about menu Menu_0's div. */ position:absolute; left:0px; top:0px; visibility:hidden; background-color:#FFCC33; border:1px solid #FFCC33; width:158px; height:111px; } One mo Code: BODY { BACKGROUND:#FFCC33; COLOR:#000000; FONT-FAMILY:SANS-SERIF FONT-STYLE:Arial; FONT-SIZE:12; } A:LINK { COLOR:#EB3914; text-decoration:NONE; } A:VISITED { COLOR:#EB3914; text-decoration:ITALICIZED; } A:HOVER { COLOR:#000000; text-decoration:underlined; } A:ACTIVE { COLOR:#000000; } .BORDER { BORDER:1PX SOLID BLACK; BACKGROUND:#FFBB33; COLOR:#000000; } .YELLOW { BACKGROUND:#FFCC33; } .MainMenu { margin:auto; width:800px; } ANY help in this matter would be most appreciated. P.S. There was more coding but I got yelled at saying it was too long. Sincerely, -gamesfreke Hi, I want to align some text but not with the center or something but i want it to aling to a square on my background image and i also want to make it so that is looks the same on widescreens. at the moment i do it like this <BODY leftmargin="150%" topmargin="220%"> f </BODY> But when i enter window mode the text also moves. can someone help me with tihs ? |