Search the Community
Showing results for tags 'paragraph function'.
Found 1 result
-
I'm confused about why a paragraph element is acting a certain way. I don't know how a p element is suppose to act, so I don't know if this is my fault.The paragraph is on the right side of an image with a float left, and the text in the paragraph element stays to the right of the image as I imagined it would. However, the paragraph element itself is also covering the image so that the image is not selectable.I've since changed the paragraph element to a span and it seemed to fix the problem, but I'm still confused about why the paragraph element did that. Is there some way to define the size of a p element, or perhaps some other way to fix this problem? Here's a snippet or the original code: Basically part of the <p id="wedText"> was over top of <img id="weddingLimo"<div id="weddings"><img id="weddingLimo" src="images/wedding-limo.jpg" width="168" height="112" alt="Wedding Limo Image" /> <span id="wedHeader">WEDDINGS</span> <p id="wedText">Trust us for all your wedding and special occasion transportation needs for wedding party, friends and family.</p></div>}#weddings { position: absolute; left: 10px; top: 20px; height: 111px; width: 334px; vertical-align: middle;}#weddingLimo { float: left; margin-right: 13px;}#wedHeader { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-style: normal; font-weight: bold; color: #666; position: relative; top: 4px;}#wedText { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-weight: normal; color: #666; position: relative; top: 12px;} For a closer look at my code (current):HTML - <!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>Sarasota-Tampa Express Homepage</title><link href="all.css" rel="stylesheet" type="text/css" /><script type="text/javascript">function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script></head><body id="theHeader" onload="MM_preloadImages('images/homeActive.png','images/about-usActive.png','images/route-and-scheduleActive.png','images/flight-informationActive.png','images/fareActive.png','images/one-way-over.png','images/round-trip-over.png','images/one-way-over2.png','images/round-trip-over2.png')" ><table id="headerTable" border="0" cellspacing="0" cellpadding="0"> <tr> <td id="logoBox"> <img src="images/Sarasota-Tampa-Express-Logo.png" width="205" height="75" alt="Logo" /></td> <td> <div id="rightsideHeader"> <p id="tagLine">We make things convenient for you! <span id="phoneNumber">Call Today! (941)366-6600</span></p> <div align="left" id="navigation"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/homeActive.png',1)"><img src="images/home.png" alt="Home" name="Home" width="82" height="33" border="0" id="Home" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('AboutUs','','images/about-usActive.png',1)"><img src="images/about-us.png" alt="About Us" name="AboutUs" width="110" height="33" border="0" id="AboutUs" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Route','','images/route-and-scheduleActive.png',1)"><img src="images/route-and-schedule.png" alt="Route & Schedule" name="Route" width="178" height="33" border="0" id="Route" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('FlightInfo','','images/flight-informationActive.png',1)"><img src="images/flight-information.png" alt="Flight Information" name="FlightInfo" width="184" height="33" border="0" id="FlightInfo" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Fare','','images/fareActive.png',1)"><img src="images/fare.png" alt="Fare" name="Fare" width="70" height="33" border="0" id="Fare" /></a></div> </div> </td> </tr></table><table id="mainTable" width="1024px" height="174px" align="center" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="top" colspan="2" valign="bottom"><img align="middle" alt="Introductory Homepage Image" src="images/shuttlebus.png"><p id="welcome" align="left">Welcome to Sarasota - Tampa Express</p><p id="statement" align="left">Sarasota-Tampa Express offers regular daily round trip shuttle service<br>to and from Tampa International Airport.</p></td> </tr> <tr> <td id="bottomLeft" align="left" valign="bottom"> <p id="otherServicesText">Other Services</p> <div id="otherServicesBoxes"><img src="images/other-services.png" width="348" height="300" alt="Other services background" /> <div id="weddings"><img id="weddingLimo" src="images/wedding-limo.jpg" width="168" height="112" alt="Wedding Limo Image" /> <span id="wedHeader">WEDDINGS</span><br /> <span id="wedText">Trust us for all your wedding and special occasion transportation needs for wedding party, friends and family.</span></div> <div id="events"><img id="eventBus" src="images/event-bus.jpg" width="179" height="112" alt="Event Bus Image" /> <span id="eveHeader">SPORTS EVENTS</span><br /> <span id="eveText">Let us be your means<br />of transporting all your family, friends, and<br /> their friends to that<br />next big game.</span></div> </div> </td> <td class="bottomRight" align="center" valign="top"> <p>Rental Fleet</p> <img width="552" height="140" alt="Rental Fleet" src="images/rental-fleet.png"> <p id="limoVans">Our limo vans get your big family from place to place.</p><p id="townCars">Vacation in style with one of our luxurious town-cars.</p><p id="travelBus">Transport employees to a big function in our travel bus.</p> <div id="flightTypeBox" align="center"> <img src="images/flight-type-box.png" width="130px" height="205px" alt="Flight Type Box" /> <p id="fromAirport">From Airport</p> <a id="oneWayFA" href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('one way','','images/one-way-over.png',1)"><img src="images/one-way.png" alt="from airport one way" name="one way" width="85" height="25" border="0" id="one way" /></a> <a id="roundTripFA" href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('round trip','','images/round-trip-over.png',1)"><img src="images/round-trip.png" alt="from airport round trip" name="round trip" width="85" height="25" border="0" id="round trip" /></a> <p id="toAirport">To Airport</p> <a id="oneWayTA" href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('one way 2','','images/one-way-over2.png',1)"><img src="images/one-way2.png" alt="to airport one way" name="one way 2" width="85" height="25" border="0" id="one way 2" /></a> <a id="roundTripTA" href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('round trip 2','','images/round-trip-over2.png',1)"><img src="images/round-trip2.png" alt="to airport round trip" name="round trip 2" width="85" height="25" border="0" id="round trip 2" /></a></div> </td> </tr> </table> </body> CSS - /*==== universal ====*/.body { font-family: Verdana,Geneva,sans-serif;}.table { margin: 0; padding: 0;}.td { border-style: none; margin: 0; padding: 0;}img { border-style: none; text-decoration: none;}p {margin: 0px;}/*==== header ====*/#theHeader { background-image: url("images/header-gradient.png"); background-repeat: repeat-x; margin: 0;}#headerTable { height: 150px; margin-left: auto; margin-right: auto; width: 1024px;}#logoBox { padding-left: 50px; width: 268px;}#tagLine { color: #FFFFFF; font-family: Verdana,Geneva,sans-serif; font-size: 16px; font-style: italic; height: 45px; margin: 0; padding-top: 35px; text-align: left; width: 706px;}#rightsideHeader { height: 150px; margin-top: 0; width: 624px;}#phoneNumber { padding-left: 100px;}#navigation { height: 70px; width: 706px;}/*==== main content ====*/#mainTable { background-image: url("images/background-gradients.png");}.top { height: 174px; margin: 0; overflow: hidden; padding: 0; width: 1024px;}.top img { float: left; margin-right: 15px;}#welcome {color: #C34306;font-family: Arial,Helvetica,sans-serif;font-size: 28px;font-style: normal;font-weight: bold;height: auto;text-shadow: 2px 2px 15px #7F7F7F;width: 1024px;text-indent: -37px;margin-bottom: 45px;margin-top: 0px;margin-right: 0px;margin-left: 0px;}#statement { color: #000000; font-family: Arial,Arial,Helvetica,sans-serif; font-size: 14px; font-style: normal; font-weight: bold; height: auto; margin: 0; width: 1024px;}#bottomLeft { height: 440px; width: 406px;}/*==== bottom right ====*/.bottomRight {height: 440px;width: 618px;}.bottomRight p {font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-style: italic;font-size: 19px;text-align: center;}.bottomRight img {margin-top: auto;margin-right: auto;margin-bottom: auto;margin-left: auto;} #limoVans {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-weight: normal;color: #666666;width: 160px;float: left;margin-left: 45px;margin-right: 22px;position: relative;top: -36px;font-style: normal;}#townCars {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-weight: normal;color: #666666;width: 160px;float: left;margin-right: 24px;position: relative;top: -36px;font-style: normal;}#travelBus {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-weight: normal;color: #666666;width: 160px;float: left;position: relative;top: -36px;font-style: normal;}#flightTypeBox {margin-right: 30px;float: right;width: 130px;height: 205px;vertical-align: middle;position: relative;top: -19px;}#fromAirport {font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-size: 12px;color: #4D4D4D;position: relative;top: -168px;font-style: normal;}#oneWayFA {position: relative;top: -165px;}#roundTripFA {position: relative;top: -163px;}#toAirport {font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-size: 12px;color: #4D4D4D;position: relative;top: -153px;font-style: normal;}#oneWayTA {position: relative;top: -149px;}#roundTripTA {position: relative;top: -147px;}/*==== bottom left ====*/#otherServicesBoxes {height: 300px;width: 348px;margin-left: 30px;margin-bottom: 63px;position: relative;}#otherServicesText {font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-style: italic;font-size: 19px;margin-left: 63px;}#events {position: absolute;bottom: 10px;left: 10px;height: 111px;width: 325px;}#weddings {position: absolute;left: 10px;top: 20px;height: 111px;width: 334px;vertical-align: middle;}#weddingLimo {float: left;margin-right: 13px;}#wedHeader {font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-style: normal;font-weight: bold;color: #666;position: relative;top: 4px;}#wedText {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;font-weight: normal;color: #666;position: relative;top: 12px;}#eventBus {float: left;margin-right: 13px;}#eveHeader {font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-style: normal;font-weight: bold;color: #666;position: relative;top: 4px;}#eveText {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;font-weight: normal;color: #666;position: relative;top: 12px;}
