|
HTML - Positioning Hr Rule?
Similar TutorialsWith the "horizontal rule", is it possible to write over it? The reason I am asking is because I saw an example of a horizontal rule, and it reminded me of a footer. Are they used for footers if some cases? Cheers guys (and I apoligize for all the questions). Hi, hope someone can help. For some reason I can't seem to get a horizontal rule to show in my website and I can't for the life of me understand why ! Could someone advise me please. My code is below. I'm not sure if it's something to do with css. 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" lang="en" xml:lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Back Garden Moths</title> <meta name="keywords" content="moths,garden,uk,british,British,large,butterflies,recording,light,sugar,moth group,back garden,wildlife,traps,actinic,uk moths,moth species,macro moths"/> <meta name="description" content="Few people realise the wide spectrum of moth species which often rival the beauty of butterflies. Some even consider the moth to be the pinnacle of the insect world. This site includes information on the techniques involved in moth recording and aims to encourage others to discover the diversity of the moth world hidden in their own back garden."/> <link href="default5.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="logo"> <h2><a href="http://www.back-garden-moths.co.uk/"></a></h2> </div> <div id="page"> <ul id="tabmenu"> <li><a class="active" href="index.php">Home</a></li> <li><a href="Databaseintro.php">Species search</a></li> <li><a href="recordsmain.php">Members records</a></li> <li><a href="forum/gallery/menu.php">Gallery</a></li> <li><a href="tab3.html">Thumbnail index</a></li> <li><a href="monthid.php?flightID=<?php echo date( 'F', time() ); ?>">What's flying this month?</a></li> <li><a href="Sightings.php">Sightings</a></li> <li><a href="Links.htm">Useful Links</a></li> </ul> <div id="navbar"> <li><a href="tab2.html">Forum Index</a></li> <hr/> <br /> </div> <img src="Images/Lob.jpg" alt="Zeiraphera isertana" width="400" class="left" /> <h2 class="title">Back Garden Moths - the community moth site...</h2> <p>For many people, encounters with moths revolve around unwanted intrusions into their homes. </p> <p> Few people realise the wide spectrum of moth species which often rival the beauty of butterflies. Some even consider the moth to be the pinnacle of the insect world. This site includes information on the techniques involved in moth recording and aims to encourage others to discover the diversity of the moth world hidden in their own back garden. </p> <h3>Come and take part</h3> <p>There are a number of ways in which you can contribute to the site and extend your own knowledge in this area. A comprehensive <a href="forum/index.php">forum</a> is available if you have any questions, comments or would like to chat to other wildlife enthusiasts. So come along and join. The <a href="Sightings.php">sightings</a> section enables you to post sightings of any interesting moths or butterflies you have seen in and around your garden. And finally there's the <a href="recordsmain.php">members records</a> section which allows you to post all your records in your own personal database. Your records can be searched to keep a track on the number and variety of species recorded, plus a variety of other statistics are available. Data entered is also combined to give a running commentary on the types of moths flying across the UK.</p> <p> </p> </div> <!-- end page --> <div id="footer"> <p id="legal">© Simon Wantling 2008 </p> <p id="links"><a href="http://www.statcounter.com/" target="_blank"><img class="statcounter" src="http://c2.statcounter.com/335444/0//0/" alt="website stats" ></a></p> </div> <!-- Start of StatCounter Code --> <script type="text/javascript"> var sc_project=335444; var sc_invisible=0; var sc_partition=1; var sc_security=""; </script> </body> </html> Is there a way in plain old HTML (not CSS) to place a margin around a <hr>? I'm somewhat new to HTML, and have searched all over, and can't find how to do this Hi guys, got a question about a html issue. ill explain the situation, 2 persons publish htm files, this is automated, each html files is unique, so lets say person one creates indexa.htm and person two creates indexb.htm I need a general index who refer to either indexa or indexb, with the rule that it should pick the latest one changed or the newest one. Is this possible in pure html ?? Thanks in advance, Nim. Hi, I can't seem to get these images to center after using position:fixed on them. Here's the code I have: Code: <html> <head> </head> <body> <div style="position: fixed; top: 0px;"> <img src="top.jpg"> </div> <div align="center"> <table width="1025" bgcolor="gray"> <tr> <td> <middle text> </td> </tr> </table> </div> <div style="position: fixed; bottom: 0px;"> <center><img src="bottom.jpg"></center> </div> </body> </html> Hi, Would some be able to help me with the layout of my page? I want it to look like this and this is what it looks like now. I don't want to do it using borders but I can't seem to figure it out using positioning. Anyone able to help? CSS Page Regards, Darren I believe this is a HTML problem: Old site: http://www.ardmoreweatherlive.com/ . Old site CSS: http://www.ardmoreweatherlive.com/weather-screen.css New site: http://www.ardmoreweatherlive.com/test3.php New CSS: http://www.ardmoreweatherlive.com/weather-screen2.css I am trying to get rid of the old left side menu and maybe get the page to float in the center with, I think padding(?) around the edges. I really thank everyone for the help, Doug Thanks for all your help I am making great progress thanks to you all. Here I've posted a picture of my current dilemma. Hopefully it makes sense. http://www.trillionaireme.com You can view my site at www.palermostaging.com. It appears fine in IE but in firefox, the alignment is thrown off a little, I think the orange column is too tall. How can I fix this without changing the text size or placement? Any suggestions are appreciated, source is viewable on the page. Thanks, Anders On this page: http://obama-net.org/bluelayout/index.html my absolute positioning is just not working. I've tried virtually everything to see what the problem could be, but I don't seem to find it? On my computer, the website looks fine when the window is maximized, but when it's minimized, the divs go all over the place. However, in other computers the divs are just never in place. Is there something wrong with my coding? I used dreamweaver. Thank you so much for your time! How can I make a small pop up window show the middle of a webpage? Hello Everyone, I 'm trying to place a total of sixteen rectangles along the edges of my webpage. I was able to do it in firefox but not IE. In IE the last rectangle does not line up with the other rectangles to its left and right. Please take a look at my code below to see where the problem lies. Thank you in advance for your help. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>Welcome</title> <style> body{text-align:center; } #container{ width:800px; margin: 0 auto; height:900px; background-image:url(""); background-repeat:no-repeat; } table{border-style:dashed;border-color:black} </style> </head> <body> <div id="container"> <!Left> <div style="float:left;"> <table width="200" height="150" style="border-width:3px 3px 0px 3px" > <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px"> <tr> <td> </td> </tr> </table> </div> <!Top1> <div style="float:left;width:200px;height: 150px;"> <table width="200" height=" 150" style="border-width:3px 3px 3px 0px"> <tr> <td> </td> </tr> </table> </div> <!Top2> <div style="float:left;width:200px;height: 150px;"> <table width="200" height="150" style="border-width:3px 0px 3px 0px"> <tr> <td> </td> </tr> </table> </div> <!Right> <div style="position:relative;float:right;top:0px;width:200px"> <table width="200" height="150" style="border-width:3px 3px 0px 3px" > <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px 3px 0px 3px"> <tr> <td> </td> </tr> </table> <table width="200" height="150" style="border-width:3px"> <tr> <td> </td> </tr> </table> </div> <!Bottom1> <div style="position:relative;float:left;width:200px;height:150px;top:600px;"> <table width="200" height=" 150" style="border-width:3px 3px 3px 0px"> <tr> <td> </td> </tr> </table> </div> <!Bottom2> <div style="position:relative;float:right;width:200px;height:150px;top:600px;"> <table width="200" height="150" style="border-width:3px 0px 3px 0px"> <tr> <td> </td> </tr> </table> </div> </div> </body> </html> Hello all, i am new to html coding and i am working on an assignment for university. I have come across one problem that i don't know how to fix. I want to make a web page that when the user maximizes the screen size or is using a different sized screen the web pages components would stay consistently in one spot. We did a basic page when i was in high school and all we used were "div" 's in css sheets and they use a fixed position on a screen. i tried using percentage and not pixels when positioning the "div"'s but im not getting anywhere......could anyone give me advise or a link to a page that explains thanks in advance Hello All- I'm trying to create a website and I am using Dreamweaver. While I'm fairly versed with Dreamweaver's nuances, there's one thing that I've never been able to do. I've created a white rectangle box in photoshop that I want to use as the main part of my site where all the text and pictures go. I want the rectangle positioned vertically and to go "off-screen." I have a blue background behind it. My problem is, the rectangle doesn't go to the furthest point of the top and bottom of the browser. Here is an example of what I want done: http://www.logoworks.com/ If you check out that website, you'll notice the rectangle shape in the middle behind the text and graphics. It goes to the furthest part of the top "off-screen." The picture I've attached is what happens to me what I try to play around with the padding and positioning (i've tried both html and css). Any help would be great. Thanks! Hello again, Guys! I have a tiny HTML / CSS problem, which i'm not being able to solve. I have the following webpage set up; http://www.myhrensolutions.net/workpappa/index.html With the following CSS file; http://www.myhrensolutions.net/workpappa/index.css What i'd like to accomplish, is to make another Div, that would emplace in the middle, like shown on this pictu http://i56.tinypic.com/2cf62bn.png How i did try to solve this, was to create a new div right after the opening of the mainbody div, and then add the margin values to it, but it just made the whole page flip out of alignment (some elements were skewed further down the site etc.) Could you guys please help me? Thank you! Alright so basically what I want to do is take this site: http://insightahoy.com/innuendo/plug...rogress.php?s= and iFrame JUST the center part were it has the bosses and the progress, I just want that part of the site. How would I create an iFrame to suck up just that part of the side and nothing else, what would the code be, I am very new to the whole HTML iframe thing. So any help would be much appreciated. I am having trouble positioning a table on my site. I have managed to align it in the vertical position but using any form of centering only aligns the left edge to the center. I need the centre of the table in the centre if you know what i mean...! Many Thanks for any help Here is the code I am a complete beginner so have faith... <style type="text/css"> TABLE.red {position:absolute; top:310px} </style> <TABLE class="red" WIDTH="200" SPAN style="COLOR: #0000ff" CELLPADDING="0" CELLSPACING="0" BORDER="0" STYLE="background-color: #660033" position:absoloute; left:"20px"></SPAN> <TR> <TD WIDTH="32"> <IMG SRC="rounded_corner1.jpg" BORDER="0" ALT="..." width="32" height="32"></TD> <SPAN style="COLOR: #0000ff"><TD WIDTH="172"></TD></SPAN> <TD WIDTH="32"><IMG SRC="rounded_corner2.jpg" BORDER="0" ALT="..." width="32" height="32"></TD> </TR> <TR> <SPAN style="COLOR: #0000ff"><TD></TD></SPAN> <TD ALIGN="CENTER"><STRONG>ACTUAL CONTENT</STRONG></TD> <SPAN style="COLOR: #0000ff"><TD></TD></SPAN> </TR> <TR> <TD><IMG SRC="rounded_corner3.jpg" BORDER="0" ALT="..." width="32" height="32"></TD> <SPAN style="COLOR: #0000ff"><TD></TD></SPAN> <TD><IMG SRC="rounded_corner4.jpg" BORDER="0" ALT="..." width="32" height="32"></TD> </TR> </TABLE> </CENTER> Hi there. I am working on a website for a friend who created it using Word and then found that this doesn't work in FF (the files were .mht). I only know basic HTML, and no CSS. I can do most of what I need to but am having two problems. Firstly, some of the positioning is out in FF, but if I change it so it's ok in FF it's then out in IE. Word appears to have positioned everything using  s: HTML Code: <span style='mso-spacerun:yes'> </span> <span style='mso-tab-count:3'> &nbs p; </span> <span style='mso-spacerun:yes'> </span> <!--[if gte vml 1]> <v:shape id="_x0000_i1030" type="#_x0000_t75" style='width:141pt;height:141.75pt'> <!-- sixth image file --> <v:imagedata src="TA6.jpg" o:title="TA6"/> </v:shape> <![endif]--> <![if !vml]> <img border=0 width=188 height=189 src ="TA6.jpg" v:shapes="_x0000_i1030"> <![endif]> <span style='mso-spacerun:yes'> </span><!--[if gte vml 1]> <v:shape id="_x0000_i1031" type="#_x0000_t75" style='width:141pt;height:2in'> I know this is horrible code. Is there any simple way to ensure that the image ends up in the same place in IE and FF? Do I need to use absolute positioning, and if so, can anyone direct me to good resources on this? Secondly, I'm having problems with an horizontal line which appears in IE but not in FF. The code is HTML Code: <h2 style='margin-left:36.0pt;text-indent:36.0pt'> <!--[if gte vml 1]> <v:line id="_x0000_s1031" style='position:absolute;left:0;text-align:left;z-index:1' from="1in,33pt" to="647.15pt,33pt" strokecolor="#396" strokeweight="3.5pt"/> <![endif]--> <![if !vml]> <span style='mso-igno vglayout;position:absolute;z-index:1;left:0px;margin-left: 93px;margin-top:41px;width:773px;height:6px'> This displays correctly as a shaded green line in IE, but as a white line with a thin black border in FF. From searching I think this is VML and not supported by FF - is this correct? In that case, I think I need to use the <hr> command, but how do I add an attribute to <hr> to ensure it's placed in the right place? Is the only solution a table? Sorry for the stupid questions, I know Word code is a terrible place to start from, I'm just trying to avoid redoing it all. sorry for the nooby question but - i wanna position a table in the center of page but right at the top with no gap. ive tried: <table style="position:absolute;top:0px;left:auto;right:auto;"> but that doesn't work. can someone pls help me. thanks. Hi guys. Sorry if I'm inconveniencing you, but I have a really big problem that I can't work out. http://automata.firephoenixnet.com/design/ Could you take a look at that in Firefox and then in IE? Did I miss a margin or something? And, is there a way I can get my footer div always at the bottom of the page without setting a margin-bottom for the sidebar div? Many thanks guys. |
|||||||