|
HTML - Needed Help........aligning Banners
hi guys
hru I am a newbie....Need some help from you.I wanna make a simple HTML page like the picture below. Many times I have tried but failed.Haven't the correct html coding. I stuck in how to align those banners so that the page looks beautiful too. Plz help me. I hope that you guys will. Thanx in advance. Similar TutorialsNo longer need assistance. How can I upload a banner in this post? Hello all, I'm new to the forum and I am relearning a bit of html. I was wondering if I could get some help coding an image onto my webpage. I created the image using Gimp and saved it as .jpg. Here is my code: <h1><img src="users/andrew/programming/blog/blogbanner.jpg" width="728" height="90" borders="0"/></h1> If it helps at all. I am using a mac. Thanks to anyone who can help me out with this. Im currently building a website for a local football team. The banner looks fine on my notebook, but when i transfer it to other computers, the size changes. Now i thought this was because i set my banner by pixels (e.g. 100px) but ive recently changed both height and width to 100% and have changed it around to 10% etc and this hasn't changed anything. After giving up i found a site where the page is actually centered with like a white background all around it. http://www.burscoughfc.co.uk/ thats the site, i was wondering if you could help me get my site to allighn in the centre with that sort of background or not. Any help would be much appreciated. Metcalfe88. Does anyone have any easy javascript code for making clickable banners? how can i make a hyperlink or a banner\picture, that will cahnge for every diffrent ip, what i mean is if i want all pepole coming from the Italy to see specific banner/ or hyperlink , and peple from UK to see diffrent banner\hyperlink, and all pepole from francer to see a diffrent and so on and so on.... How can i do it, I know its possibale becouse advertaizers do it. Thanks. Hi, I have developed a menu with a dropdown list with html and css. But I have a banner that change sometimes the advertisement. Sometimes the dropdown list is correct and sometimes the advertisement hide the list. I have tried with z-index but nothing as well with <li onmouseover="this.className='sfHover';document.getElementById('advertHead').style.visibility='hidden ';" onmouseout="this.className='';document.getElementById('advertHead').style.visibility='visible'" ><a>More</a> but nothing this is the banner I want to hide <div runat="server" id="advertHead" class="banner" style="left:340px;top:25px;z-index:-1"> <!--JavaScript Tag // Tag for network 729: Media Corporation Plc // Website: Sport.co.uk // Page: ROS // Placement: ROS-default-468 x 60 (1522448) // created at: 27-Feb-08 PM 02:03 --> <script language="javascript" type="text/javascript"> <!-- if (window.adgroupid == undefined) { window.adgroupid = Math.round(Math.random() * 1000); } document.write('<scr'+'ipt language="javascript1.1" src="http://adserver.adtech.de/addyn|3.0|729|1522448|0|1|ADTECH;cookie=info;loc=100;target=_blank;key=key1+key2+key3+key4;grp='+win dow.adgroupid+';misc='+new Date().getTime()+'"></scri'+'pt>'); //--> </script><noscript><a href="http://adserver.adtech.de/adlink|3.0|729|1522448|0|1|ADTECH;loc=300;key=key1+key2+key3+key4" target="_blank"><img class="banner" src="http://adserver.adtech.de/adserv|3.0|729|1522448|0|1|ADTECH;cookie=info;loc=300;key=key1+key2+key3+key4" style="width:468px; height:60px; margin: 10px 0 0 143px;" alt="banner 468x60" /></a></noscript> <!-- End of JavaScript Tag --> </div> PLEASE HELP ME Hey.. I want to add Images that stay fixed on my page (all pages on my forum). I want them both on the left of my pages & the right (in the spaces between the forum body & the sides of the screen) I want it because i want the images to link to game, console & accesory reviews that have been done on my forum. I googled it and got the following code to add.. Code: <a target='_blank' href='http://yourlink.com' text='About your link'><img src='yourimagepath.jpg' alt='About your image' style='position: fixed; bottom: 25px; right: 10px;'></a> If it was a normal webpage i would add this to it, but as its a forum & a forum has 1000s of pages.. What files do i edit this into for for it to show on all my forum pages? The page i got it from is.. - http://jensocial.com/group/ningnetwo...s-and-links-on Also.. I will want 3 or 4 images on each side, so would i just add the code how ever many times, changing the part thats say "right" to "left" (for left side images) & the part that says "bottom" to "top" (for top ones)? My Forum Softwa phpBB My Forum Link: http://www.xboxlivefan.org/ Anybody help with some info on this please? Thanks! 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? 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! 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. 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! 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/ <div align="center"> <table height="117" cellspacing="0" cellpadding="0" border="0" class="btn1 boxbtn1"> <tr> <td> <a href="images/gymfu.png" rel="lightbox[roadtrip]" title="Gym Fu - Branding">image #1</a></td> </tr> </table> </div> ----- I've tried 'valign="middle" ' in the html code, and also 'vertical-align:center' in the css. no joy. Can anyone help? 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 ? Hi, I recently created a landing page for my site but cannot seem to adjust the alignment of the main container element. I want to try and centre the main container vertically by putting a margin at the top. However, it will only let me put in a maximum of 10px margin? If someone could show me how to do this I would be very grateful. The url is http://www.amokcuisine.com and I hope you will see what I am getting at! Thanks GG Please can someone help me with html code to align boxes in code below. Boxes are all out of line at the moment. I have read that it is best to create a table, however I am really new to html and not sure how to do that. Thank you James HTML Code: <fieldset> <br> <div> <input type="hidden" name="sexuality" value="1"> </div> <div> <label>I'm a:</label> <select name="gender"> <option value="1" selected>man looking for a woman</option> <option value="2">woman looking for a man</option> </select> </div> <div> <br> <label>First name:</label> <input name="firstname" type="text"> </div> <div> <br> <label>D.O.B.:</label> <select name="dobday"> <option value="">Day</option> <option value="1">01</option> <option value="2">02</option> <option value="3">03</option> <option value="4">04</option> <option value="5">05</option> <option value="6">06</option> <option value="7">07</option> <option value="8">08</option> <option value="9">09</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select name="dobmonth"> <option value="">Month</option> <option value="1">January</option> <option value="2">February</option> <option value="3">March</option> <option value="4">April</option> <option value="5">May</option> <option value="6">June</option> <option value="7">July</option> <option value="8">August</option> <option value="9">September</option> <option value="10">October</option> <option value="11">November</option> <option value="12">December</option> </select> <select name="dobyear"> <option value="">Year</option> <option value="1990">1990</option> <option value="1989">1989</option> <option value="1988">1988</option> <option value="1987">1987</option> <option value="1986">1986</option> <option value="1985">1985</option> <option value="1984">1984</option> <option value="1983">1983</option> <option value="1982">1982</option> <option value="1981">1981</option> <option value="1980">1980</option> <option value="1979">1979</option> <option value="1978">1978</option> <option value="1977">1977</option> <option value="1976">1976</option> <option value="1975">1975</option> <option value="1974">1974</option> <option value="1973">1973</option> <option value="1972">1972</option> <option value="1971">1971</option> <option value="1970">1970</option> <option value="1969">1969</option> <option value="1968">1968</option> <option value="1967">1967</option> <option value="1966">1966</option> <option value="1965">1965</option> <option value="1964">1964</option> <option value="1963">1963</option> <option value="1962">1962</option> <option value="1961">1961</option> <option value="1960">1960</option> <option value="1959">1959</option> <option value="1958">1958</option> <option value="1957">1957</option> <option value="1956">1956</option> <option value="1955">1955</option> <option value="1954">1954</option> <option value="1953">1953</option> <option value="1952">1952</option> <option value="1951">1951</option> <option value="1950">1950</option> <option value="1949">1949</option> <option value="1948">1948</option> <option value="1947">1947</option> <option value="1946">1946</option> <option value="1945">1945</option> <option value="1944">1944</option> <option value="1943">1943</option> <option value="1942">1942</option> <option value="1941">1941</option> <option value="1940">1940</option> <option value="1939">1939</option> <option value="1938">1938</option> <option value="1937">1937</option> <option value="1936">1936</option> <option value="1935">1935</option> <option value="1934">1934</option> <option value="1933">1933</option> <option value="1932">1932</option> <option value="1931">1931</option> <option value="1930">1930</option> <option value="1929">1929</option> <option value="1928">1928</option> <option value="1927">1927</option> <option value="1926">1926</option> <option value="1925">1925</option> <option value="1924">1924</option> <option value="1923">1923</option> <option value="1922">1922</option> <option value="1921">1921</option> <option value="1920">1920</option> <option value="1919">1919</option> <option value="1918">1918</option> <option value="1917">1917</option> <option value="1916">1916</option> <option value="1915">1915</option> <option value="1914">1914</option> <option value="1913">1913</option> <option value="1912">1912</option> <option value="1911">1911</option> <option value="1910">1910</option> <option value="1909">1909</option> </select> </div> <div> <br> <label>Email:</label> <input name="email" type="text"> </div> <div> <br> <label>Password:</label> <input name="password" type="password" value=""> </div> <div> 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 Im trying to get something to align to the right side of a table, and cant seem to get it right. What this should look like is 'First One' in a cell, and 'Second One' in a cell bellow it, and to the right side they should each have two check marks side by side. Can anyone see what Im doing wrong? Thanks. <form method="post" action="file.php"><br/><div id="Accordion1" class="Accordion" tabindex="0"> <div class="AccordionPanel"> <div class="AccordionPanelTab"></div> <div class="AccordionPanelContent"><form action="file.php" method="post"> <table border="3" width="600"> <tr> <td><strong>First One</strong> </td> </tr> <input type="checkbox" name="a" /><input type="checkbox" name="aa" /></td> </tr> </table> <table border="3" width="600"> <tr> <td><strong>Second One </strong> </td> </tr> <input type="checkbox" name="b" /><input type="checkbox" name="ab" /></td> </tr> </table> <p></p> <input type="submit" value="Submit" name="submit"><br/></form><br/> |
|||||||