HTML - Level 2 Heading Next To Navigation
Hello everybody,
As you can see here http://arturbuchhorn.com/index.html the h2 element is displayed right alongside the navigation. What would be the best way to move the heading below the navigation? Thank you. PS: I would prefer a CSS solution if possible. The code is right he Code: /* CSS for Un Buchhorn en route */ a:visited { color: black; } #sitebranding a { border: 3px solid white; padding: 20px 10px 20px 10px; } #sitebranding a:hover { background-color: #FFE4C4; } #tagline { margin: 2em 0 1em 0; } #navigation { } #navigation ul li { list-style-type: none; float: left; margin: 0px 5px 0px 0px; } #navigation ul li a { background-color: #FFE4C4; text-decoration: none; border: black 1px solid; border-bottom: none; padding: 0 10px 2px 10px; } #navigation ul li a:hover { background-color: #F5DEB3; } #navigation ul li a:visited { } #bodycontent { } body { font-family: Calibri, Arial, Verdana, sans-serif; background-color: #F5DEB3; } #essay { text-align: justify; margin: 0 15% 0 15%; } #worksList ul { margin: 3em 0 3em 0; } #worksList ul li { list-style-type: square; line-height: 200%; } #worksList ul li a{ text-decoration: none; } #footnotes { font-style: italic; text-align: left; } h1 { font-family: "Jayne Print"; font-size: 200%; } h1 a { text-decoration: none; } h2 { font-size: 125%; font-weight: normal; } #footer p { font-size: 60%; font-family: Arial; font-style: italic; } #adsense { position: absolute; right: 0; top: 5%; } #pagedoesnotexist p { margin: 20% 20% 20% 25%; color: red; font-size: 125%; } Similar TutorialsSo here goes: i have to make a heading for my web page (that has to be made using html) and it has to be: -centered -times new roman -and font size 6 -bold .... is this right? or am i suppose to somhow use those <h1> tags. <!--heading--> <div id="header" align="center" style="z-index:5"> <b><font color="#ffffff" size="6" face="Times New Roman">My heading</font></b> </div> <!--end heading--> ....okay and another one: how do i put an image behind the text. i know how to put a coloured block behind it, but when i try to put an image behnd the heading, the text goes behind the picture.... i did it like this: <!-- Heading --> <div id="header image" align="center" style="top: 0px; left: 9px; position: absolute; z-index: 4; width: 1239px; height: 58px"> <img src="background.png" width="1245" height="61" alt="header"> </img> </div> <!-- Heading --> please hepl?!?!? this issue has been solved Hi: I wish to place a heading in the middle of a horizontal line (i.e., maybe using <hr /> ??) at various places in my page. That is, I would like a line in my page to look like: ----------------------------------- NOTICES --------------------------------------- How can I do this please ? Thanks, -Mel Smith I have created a image background for the heading by writing index. but when i run on my machine i can see the image. where as after placing on the web sever i couldn't see the image. please do help me in this regard. <style type="text/css"> img.b { position:absolute; left:440px; top:10px; z-index:-1 } </head> <BODY> <form name='app'> <h1 align="center"><b>aduit application</b></h1> <img class="b" src="dock1.gif" width="380" height="60"> Hi everyone, I'm sure there's a simple answer to this one but I can't work it out. I have a heading <h1>Services</h1> and want to align some text next to this, not below it. <p>blah blah blah</p> places the text below. What would align the text directly to the right of the heading? Many thanks Phil My website home page has no h1 tag, only a h3 tag, and that was used to create a heading of a certain font size. My spider simulator reports there in no h1 tag, suggesting that isn't good for SEO. Should I make sure there is a h1 tag somewhere, and can that be anywhere on the page? (It's not a heading as such). I want a certain sentence to be the h1 tag as it contains several of the keywords. Can I make these changes and dump the h3 tag, leaving only one h1 tag? And can it be done locally rather than in a css file? My website uses the Woo Canvas theme in Wordpress. Hello, I am new to web design and am just learning the basics right now. I am trying to have an ad banner show up to the right of the main heading for my site. What would be the best way to have these two show up side by side within the same div box? Is there a way to turn off the line break that naturally occurs with headings? Thanks for your suggestions in advance! Here is some of the code I am working with: Code: <div class="heading"> <h1><a class="header" href="home.htm">Plotbound.com</a></h1> <script type="text/javascript" src="http://x10hosting.com/adserve.js?kaoticja"></script> </div> And the CSS: Code: div.heading { background-color: #ffffff; border-bottom: 3px ridge #000000; border-left: 3px ridge #000000; margin-bottom: 10px; } - Jack I have made a box mostly from 3 divs a top middle and bottom, when I add any h1 element makes a gap between the top and the middle killing the box effect in FireFox. I have tried everything with this but now give up, does anyone have any ideas on how to fix this. I have added a another div called maincontentinner so that the text was easier to adjust but even removing this did not solve it. All I am trying to do is get rid of the tables layout and have hit a brickwall my html HTML Code: <div class="mainboxtop"></div> <div class="maincontent"> <div class="maincontentinner"><!--All content starts here--> <h1> More Information</h1> this is a test </div><!--All content stops here--> <div class="mainboxbottom"></div> </div><!-- /closing of maincontentdiv --> the CSS Code: .maincontent { background:#CFCFCF url(../images/contentmain.gif) repeat scroll 0%; border:0; width:710px; } .maincontentinner {/*added to give padding inside the box and a few other styles*/ padding-left:15px; padding-right:15px; font-size:1.2em; } .mainboxtop { background:#CFCFCF url(../images/contenttop.gif) no-repeat scroll 0%; border:0; height:26px; margin:0; padding:0; width:710px; } .mainboxbottom { background:#CFCFCF url(../images/contentbottom.gif) no-repeat scroll 0%; border:0; height:26px; width:710px; } Here's a test page to see it for real I'm having trouble with a header in IE. I'm a beginner but modifying a webpage. I have a header that when opened in Firefox or Chrome stretches normally across a page, e.g. "This is the header" However, when I open the same page in IE, I'm getting one word per line, e.g. "This is the header" Does anyone know how to resolve this please? I'd be very grateful for any help Hey guys! It's been awhile, but life has been busy and doing new things with web pages hasn't been on the top of my list. However, I've run into a small issue which will hopefully be easy to solve. I've been doing some scripting for a program which exports and imports scripts in an XML setup. I've been posting those scripts on another site, and, for now, have been instructing users to simple right+click save as... the scripts in order to get them, because, when they click on the link, it tries to bring them to a page of the XML. Is there any way for me to tell the links to simply download the XML file (effectively like right+click save as... except it will go to wherever they download stuff) if it is clicked? Hi everyone, I just started tinkering with HTML coding and have been bouncing around tutorial sites and the like trying to figure out how to achieve my goals. im trying to create a 3 framed page (easily done so far)...with a form to create a purchase order style form....(heres where i begin to struggle). i have found plenty of samples of code to get the elements of the form going, drop down menus, text input, submit form via email, ect. but what im trying to find now, and im hoping someone here can help me is this. i want to create either a multi-level drop down menu, OR, a dropdown menu that referres to the next menu. ill try to explain this better with an example.... sample content for first menu.... Bread Milk Cheese say for example you select bread..... next menu content will be dependant on the first menu's selection sample content for second menu, "Bread" selected..... Wholegrain White Wholmeal sample content for second menu "Milk" selected Full cream Low fat Long life....ect, ect. I have done plenty of searching but all i have found is stuff that is waaaaaay out of my league this early in the game, most of my searching has yielded results from javascript, flash and something called jquery. is there any way to do this without spending lots of coin on fancy programs? im just using good o'l notepad here Thanks for any assistance in this, and i do appologise if it has been covered before, perhaps i have not been using the correct key words in my searches. need help with my project! n have no idea wht to do.... have to make iq level test on FWP. 1. First in the form ppl will see do u want to check your iq level..yes or no. include options. 2. if user says no then program will be terminated 3. if user says yes then will be asked that plz log in if already a user..else plz register. 4. if user is already a member thn will be directed to the iq level page. 5. After registration user will be asked for id and password. 6. After the registration IQ test will be shown, if the answer is right thn it will be shown in green color, if its wrong thn red color will be shown. 7. After this users iq level will be shown in %. 8. N those who already took it will also be shown on the page n atlast it will say thx.'. i hope u will understand....wat i wrote...need help guys........plzzzzzzzzzzzzzz Hiyas, well I am trying to make an html website, and I got two things I trie to add to my page. One is a shoutbox using direct link code, and in the preview it displays fine, and works fine. Another is a teamspeak launcher I made, just a link and an image. I align one to the right the other to the left, and that works. The problem is, that the one on the right is level with the bottom of the shoutbox on the left, whereas I want them to be a part of two side columns eventually, where they are both the same length etc, not all uneven. Here is my preview page: http://i116.photobucket.com/albums/o...Untitled-1.gif I hope you see what I mean. Please help me, as I need this website online ASAP cos me and my clan are going to some tournaments and seriously need this online. Thanks in advance, Ferinos Basicly, the problem is when you resize the window to the site, the navigation bar moves frome the place it is suppose to be, and stretches; this throws off the whole layout of the site when the window is resized by anyone(it needs to stay in with the background but it's not) Any help will be great!!!!! Hi im currently re designing my site and would like a navigation bar similar to the one at http://spundoogle.com/skyserpent/GoogleX/ i just dont know where to begin though please help Can someone please tell me how to make the navigation and the line right to the right of the navigation as seen here on this site: http://www.girlsnightoutmusic.com/ Thanks! Hi people, I'm taking care of my web site but I would like to improve it with your help as I'm a bit of an ignorant with html and stuff. The navigation bar I've created is actually not a real navigation bar I believe. Every time you change page the bar reloads with the new page, you know what I mean? See for yourself http://www.clorinde.org/clorinde/index.htm How can I fix this so the loading of the pafe would be smoother and faster? Would you be able to provide me some codes? Thanks! I built a nice little tabbed navigation and it works great in firefox and safari and displays perfectly fine in IE 6 but for some reasons my rollovers don't work. I'm not too sure as to why, everything seems fine to me... but apparently not to Internet Explorer. I've attached my code below and you can see an example of the nav here. (I don't have IE7 installed so if someone can take a look at it in that and let me know if it works or not that would be awesome!) 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>Untitled Document</title> <!--[if IE]><link rel="stylesheet" media="screen" type="text/css" href="css/htc.css" /><![endif]--> <style type="text/css" media="screen"> * { margin: 0; padding: 0; } body { background: #999; } #tab_wrap { width: 328px; background: #fff; } #tab_wrap h1 { margin: 0 0 1px 0; width: 328px; height: 37px; background: #44c2fd url(images/header_reviews.png) no-repeat 0 0; text-indent: -2800px; } #tab_wrap ul { width: 328px; height: 31px; list-style-type: none; } #tab_wrap ul li { display: block; float: left; } #tab_wrap a { display: block; width: 55px; height: 31px; text-indent: -2800px; } #tab_wrap a:hover { background-position: 0 -31px; } #tab_wrap a.last { width: 53px; } #tab_wrap a.current { background-position: 0 -31px; } #music { background: #44c2fd url(images/tab_nav_music.png) no-repeat 0 0; } #film { background: #44c2fd url(images/tab_nav_film.png) no-repeat 0 0; } #dvd { background: #44c2fd url(images/tab_nav_dvd.png) no-repeat 0 0; } #media { background: #44c2fd url(images/tab_nav_media.png) no-repeat 0 0; } #games { background: #44c2fd url(images/tab_nav_games.png) no-repeat 0 0; } #gear { background: #44c2fd url(images/tab_nav_gear.png) no-repeat 0 0; } </style> </head> <body> <div id="tab_wrap"> <h1>Reviews</h1> <ul> <li><a id="music" class="current" title="Music Reviews">Music</a></li> <li><a href="#" id="film" title="Film Reviews">Film</a></li> <li><a href="#" id="dvd" title="DVD Reviews">DVD</a></li> <li><a href="#" id="media" title="Media Reviews">Media</a></li> <li><a href="#" id="games" title="Games Reviews">Games</a></li> <li><a href="#" id="gear" class="last" title="Gear Reviews">Gear</a></li> </ul> </div> </body> </html> Hi, I know basic html and I am trying to make a simple website for myself. I just can't get the navigation bar at the top of the page to display correctly. Look he pacificnewsnow.com/index2.htm I want to get the 2nd line of the navigation right under the 1st one. I've tried a table and it comes out like this: http://pacificnewsnow.com/index3.htm (The image for the 2 line of the nav bar will be different, but for now, it's just the same.) So, for a professional example of what I'm looking to do, look at this website: katu.com Thank you! Hi there, I am currently working on a website for the school I work at. The website requires a drop down menu that has some submenus to it. Since the site it going to be rather large, I decided to create a div for the navbar where I would use an SSI file. This would allow me to change the navbar in one place rather than on 25 pages. I have created the navbar in Fireworks, and have set up the properties for each button. I have altered the paths to the images so that they appear properly (see http://www.prestigeinteractive.com/wmems2/index.shtml ), I place the references to the js and css file in the shtml file where the menu is loaded and the paths are correct to the best of my knowledge. The problem I am facing is when the page is viewed, the drop down menu appears fifty or so pixels above where they should appear. I am not sure if I've done this correctly. Please view my work at http://www.prestigeinteractive.com/wmems2/index.shtml The files have been uploaded to this thread, as they are too long to cut and paste. Thanks for any help you can give. Greg |