Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

trouble positioning div...

Status
Not open for further replies.
rrmcguire

rrmcguire

Programmer
Oct 13, 2010
304
US
Hello at I have a div called addociationscontent which Im trying to position so its at the bottom of the news/events section and to the right of the about our company, but when I shrink my page in IE or Firefox, Safari, the div doesn't stay in place....below I've attached my code. I initially tried sticking it within another div and another ad div but doesn't seem to work..any help would be appreciated.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<style type="text/css"

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Meadow Lark Agency</title>
<style type="text/css">
<!--
body {
background-image: url(images/test%20background.png);
}
#equipavail {
color: #000;
font-size: 8px;
width: 205px;
right: 0px;
position: absolute;
height: 180px;
background-image: url(images/bigstockphoto_Red_Truck_1970809_cropped_new.png);
text-align: center;
margin-top: -20px;
vertical-align: bottom;
}
#support_text {
width: 300px;
margin-left: 150px;
margin-top: 35px;
height: 100px;
}
#equipavail #equipavailtext {
width: 180px;
padding-left: 10px;
padding-right: 10px;
margin-top: 90px;
font-size: 9px;
}
#banner {
background-image: url(images/gettycropped2.jpg);
width: 900px;
margin: auto;
height: 400px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
overflow:hidden;
}
#content #contentcompany {
height: 485px;
width: 488px;
background-image: url(images/leftcolumn_background2_new.png);
position: relative;
z-index: 2;
top: -50px;
text-align: left;
text-indent: 0em;
color: #FFF;
}
#content #contentcompany #missionstatement {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: left;
width: 300px;
left: -20px;
position: relative;
z-index: 2;
overflow: hidden;
margin-top: -20px;
}
#content #contentcompany #transportationserv {
font-size: 20px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
margin: 0px;
}
#banner #bannertext3 {
text-align: right;
padding-right: 50px;
color: #FFF;
vertical-align: top;
padding-left: 425px;
}
#banner #bannertext {
text-align: right;
padding-left: 300px;
color: #FFF;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
padding-right: 10px;
font-size: 24px;
}
#banner #bannertext2 {
text-align: right;
color: #FFF;
padding-right: 200px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 16px;
padding-top: 0px;
}
#navigation {
margin: auto;
width: 900px;
background-image: url(images/testbanner2.png);
background-repeat: no-repeat;
height: 100px;
vertical-align: bottom;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
}

#navigation #homebutton {
height: 31px;
width: 91px;
margin-top: 60px;
margin-left: 190px;
}
#navigation #container {
height: 50px;
}
#navigation #container2 {
height: 50px;
width: auto;
padding-left: 100px;
font-size: 12px;
font-family: Tahoma, Geneva, sans-serif;
color: #5A7E66;
font-weight: bold;
}
#content {
margin: auto;
width: 900px;
height: 435px;
}
#footer {
width: 900px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
background-color: #98B6A2;
height: 100px;
}
.bold {
font-weight: bold;
}
#content #contentcompany{
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 20px;
z-index: 2;
border-right-style: solid;
border-left-style: solid;
border-right-color: #5A7E66;
border-left-color: #5A7E66;
}

a {
color:#46873A;
padding-left: 10px;
}
#navigation #container2 #social {
height: 26px;
width: 100px;
margin-left: 670px;
margin-top: -15px;
padding-left: 60px;
overflow: hidden;
padding-top: 7px;
padding-right: 20px;
margin-right: 0px;
}
#content #newsevents {
width: 410px;
margin-left: 490px;
overflow: hidden;
}

#content #associations {
width: 410px;
margin-left: 490px;
overflow: hidden;
}
#content #associations #apDiv2 #associationscontent {
height: 115px;
width: 486px;
background-color: #FF0;
}
#content #newsevents #apDiv1 #newsswf {
width: 410px;
margin-top: 75px;
margin-right: 0px;
margin-bottom: 75px;
margin-left: 0px;
height: 278px;
}

-->
</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:410px;
height:435px;
z-index:3;
background-image: url(images/rightcolumn_background2.png);
}
#apDiv2 {
position:absolute;
width:486px;
height:115px;
z-index:4;
left: 632px;
top: 806px;
background-color: #FFFF00;
}


-->
</style>
</head>
<body background="images/test background.png">
<div id="navigation">
<div id="container2">
<p><a href=" Your Equipment</a> <a href=" Quote Request</a> <a href=" Booking</a> <a href=" Loads</a> <a href=" Services</a> <a href=" <div id="social"><a href=" target="_blank"><img src="images/facebooksmall.jpg" width="15" height="15" alt="meadow facebook" /></a> <a href=" target="_blank"><img src="images/twitter.jpg" width="15" height="15" alt="meadow twitter" /></a></div social>
</div container2>
<div id="container">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Home</a>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Services</a>
<ul>
<li><a class="MenuBarItemHover" href="#">Flatbed</a></li>
<li><a class="MenuBarItemHover" href="#">Van</a></li>
<li><a class="MenuBarItemHover" href="#">Heavy Haul</a></li>
<li><a class="MenuBarItemHover" href="#">Global</a></li>
<li><a class="MenuBarItemHover" href="#">LTL</a></li>
<li><a class="MenuBarItemHover" href="#">Cross Border</a></li>
</ul>
<li><a href="#">Customers</a>
</li>
<li><a href="#">Logistics</a></li>
<li><a href="#">Agents</a></li>
<li><a href="#">Contractors</a></li>
<li><a href="#">Logistics</a></li></ul>
</div container>

</div navigation>
<div id="banner">
<div id="bannertext">
<p>&nbsp;</p>
<p>A FRESH NEW LOOK AT TRANSPORTATION</p>
</div bannertext>
<div id="bannertext2"> &quot;No Bad Deals&quot;</div bannertext2>
<div id="bannertext3">
<h2 class="bold">Welcome to Our Website </h2>
<p>With over two decades of service, Meadow Lark has offered innovative solutions to any transportation need with on-demand operation services and advanced technology. Customers, Contractors, and agents alike benefit from association with our company. Family owned and operated, Meadow Lark is the premier choice for your shipping requirements.</p>
<p>&nbsp;</p>
</div bannertext3>
</div banner>
<div id="content">
<div id="newsevents">
<div id="apDiv2">
<div id="associationscontent"></div associationscontent>
</div apDiv2>
<div id="apDiv1">
<div id="newsswf">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="410" height="278" id="FlashID" title="news">
<param name="movie" value="scrollingnews_new_2.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="8.0.35.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="scrollingnews_new_2.swf" width="410" height="278">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="8.0.35.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href=" src=" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</div>
</div newsevents>
<div id="contentcompany">About Our Company
<h5>Mission Statement</h5>

<div id="equipavail">
<div id="equipavailtext">HAVE AVAILABLE EQUIPMENT YOU NEED LOADS FOR? LET US LOAD YOUR TRUCKS WITH OUR FREIGHT TODAY!! PLEASE CALL OR EMAIL YOUR AVAILABLE TRUCK LIST TO: 406-237-0811 OR equipmentavailable@meadowlarkco.com</div equipavailtext>
</div equipavail>
<div id="missionstatement">
<ul>
<li>No Bad deals. All players benefit from association with our company.</li>
<li>We are constantly in pursuit of excellence in our image and operations</li>
<li>We do not compare ourselves to any other business, only to how WE were yesterday.</li>
<li>Our Word is our bond.</li>
</ul>
</div mission>

<div id="support_text"><strong>SUPPORT</strong> CENTER<BR /> 24 Hours / 7 days a Week<br />
1-800-736-5233</div>
<div id="transportationserv">Transportation Services</div>

<div id="dropdown">
<form id="form1" name="form1" method="post" action="">
<label>
<select name="maindropdown" id="maindropdown">
<option>..open for online services</option>
<option value="index.htm">Home</option>
<option value="flatbedservices.htm">Flatbed Services</option>
<option value="vanservices.htm">Van Services</option>
<option value="heavyhaulservices.htm">Heavy Haul Services</option>
<option value="globalservices.htm">Global Services</option>
<option value="ltlservices.htm">LTL Services</option>
<option value="crossborderservices.htm">Cross Border Services</option>
</select>
</label>
<label>
<input type="submit" name="Go" id="Go" value="Go" />
</label>
</form>
</div>
</div contentcompany></div content>
<div id="footer"></div footer>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
swfobject.registerObject("FlashID");
//-->
</script>
</body>
</html>
 
Sort by date Sort by votes
should all of my text for instance be within divs as well such as within .splash, .about, and .news?
 
Upvote 0 Downvote
Line height has a number of uses such as allowing you to stretch the space between lines, making text more readable.
Putting text inside divs makes it easier to control.

Keith
 
Upvote 0 Downvote
Merely vertically centering the text. Simply appearance.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
Your text should be withing something, be it a div, a heading, a span, or a paragraph.

Depedning on what the text is conveying is what it should be inside.

A title would likely be in a heading.

A description or blurb would be in a paragraph.

etc...



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
I've begun to redo the page and right now there is gap between my menu and splash divs when I view the pages at get my text on the page am I correct where I have <h1> and <p> classes which I align by the margins to fit where I want? I've attached my current HTML, any help would be appreciated as I would like to get this designed correctly to begin with before getting too far in..thanks

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--

a:link {color: #060;}
a:active {color: #060;}
a:visited {color: #060;}


.wrapper {
width: 900px;
margin-right: auto;
margin-left: auto;
}
.menu {
background-color: acac93;
overflow: hidden;
background-image: url(images/testbanner4.png);
background-repeat: no-repeat;
}
.menu .top {
line-height: 20px;
float: right;
height: 40px;
width: 700px;
}

.menu .top p a {
font-size: 13px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;


}
.menu .Spry {
line-height: 20px;
clear: both;
float: right;
height: 35px;
width: 655px;
border-top:1px solid gray;
}

.splash {
background-color: 686898;
height: 400px;
background-image: url(images/gettycropped2.jpg);
}

.splash h1 {
color: #FFF;
font-size: 18px;
margin-top: 100px;
margin-left: 500px;
}

.splash .deals {
color: #FFF;
font-size: 16px;
margin-left: 625px;
margin-top: -10px;
}

.content {
height: 400px;
overflow: hidden;
}

.about {
background-color: 789978;
float: left;
height: 100%
width: 400px;
}

.news {
border: 2px solid gray;
float:right;
width:800px;
height:100%;
}
-->
</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
body {
background-image: url(images/test%20background.png);
}
-->
</style></head>

<body>
<div class="wrapper">
<div class="menu"><div class="top">
<p><a href=" Your Equipment</a> <a href=" Quote Request</a> <a href=" Booking</a> <a href=" Loads</a> <a href=" Services</a> <a href=" top>
<div class="Spry">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Home</a></li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Flatbed</a>
<li><a href="#">Van</a>
<li><a href="#">Heavy Haul</a>
<li><a href="#">Global</a>
<li><a href="#">LTL</a>
<li><a href="#">Cross Border</a>
</ul>
</li>
<li><a href="#">Customers</a></li>
<li><a href="#">Logistics</a></li>
<li><a href="#">Agents</a></li>
<li><a href="#">Contractors</a></li>
<li><a href="#">Logistics</a></li>
</ul>
</div spry>
</div menu>
<div class="splash"><h1>A FRESH NEW LOOK AT TRANSPORTATION</h1><p class="deals">"No Bad Deals"</p></div>
<div class="content">
<div class="about"><h1>About Us</h1></div>
<div class="news"><h1>News and Events</h1></div>
</div content>
</div><! wrapper ->
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>
 
Upvote 0 Downvote
You are misusing and abusing margins. Margins add to the dimensions of an element, and move the element also.

Your h1 tag insde the splash div has 100px margin plus .67em margin applied to it from 2 styles. So it pushes down the splash div. I'm guessing what you want is to push down the h1 header inside the splash div. If so give your splash div an overflow:hidden. That should take care of the space, and at the same time move the h1 tag down to where you want it.

Also what's with the 500px left-margin, if you want text aligned left, use the text-align property set to left. Much clearer than a 500px left margin. Apply it to your h1 tag's style.



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
Is the way I'm writing my text correct, putting the different styles in different classes....also If using the text align property what if you want to align it without setting it to just align right, but rather to a specific pixel amount?
 
Upvote 0 Downvote
rrmcguire said:
Is the way I'm writing my text correct, putting the different styles in different classes....
Click to expand...

Yes, classes are meant to style an element. Any elements that may have the same style, would use the same class.

rrmcguire said:
also If using the text align property what if you want to align it without setting it to just align right, but rather to a specific pixel amount?
Click to expand...

Yes, you can use margins to shift text left or right. But when you are using them to move past the half way point of another element and more to the other side of it, its better to use text-align, and then maybe adjust it back using the opposite margin. Rather than have a 500 pixel margin of unusable space on one side.

Margin is outside of an object, padding is inside of an object.
Border gets sandwiched between them.

Code: 
 _____________________________
|  _________________________  |
|m|  _____________________  | | 
|a|b|  _________________  | | |
|r|o|p|                 | | | |
|g|r|a|                 | | | |
|i|d|d|                 | | | |
|n|e|d|_________________| | | |
| |r|____________________ | | |
| |_________________________| |
|_____________________________|

Without overflow extreme margins like that push content outside the limits of their parents. Which is why you get spaces, between elements.



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
so for text within another div to explicitely align text to a location padding should be used?
 
Upvote 0 Downvote
similar to this:

.splash h1 {
color: #FFF;
font-size: 18px;
text-align: right;
padding-top: 75px;
padding-right: 40px;
}

.splash .deals {
color: #FFF;
font-size: 16px;
text-align: right;
padding-right: 175px;
 
Upvote 0 Downvote
Preferably yes. Though again if you are aligning it to thew other side of the container, text-align is better suited, and then padding for smaller adjustments.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Upvote 0 Downvote
when using text align though Its aligned to the rightmost point of the div its within though, correct?
 
Upvote 0 Downvote
my two menu bars for the contents within are really messed up. I don't see what the issue is unless its a setting in the spry menu itself. Below is my current HTML:

<div class="menu"><div class="top">
<p><a href=" Your Equipment</a> <a href=" Quote Request</a> <a href=" Booking</a> <a href=" Loads</a> <a href=" Services</a> <a href=" top>
<div class="Spry">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Home</a></li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Flatbed</a>
<li><a href="#">Van</a>
<li><a href="#">Heavy Haul</a>
<li><a href="#">Global</a>
<li><a href="#">LTL</a>
<li><a href="#">Cross Border</a>
</ul>
</li>
<li><a href="#">Customers</a></li>
<li><a href="#">Logistics</a></li>
<li><a href="#">Agents</a></li>
<li><a href="#">Contractors</a></li>
<li><a href="#">Logistics</a></li>
</ul>
</div spry>
</div menu>
 
Upvote 0 Downvote
here are my CSS rules:

.menu {
background-color: acac93;
overflow: hidden;
background-image: url(images/testbanner4.png);
background-repeat: no-repeat;
}
.menu .top {
line-height: 20px;
float: right;
height: 40px;
width: 700px;
}
.menu .Spry {
line-height: 20px;
clear: both;
float: right;
height: 35px;
width: 655px;
border-top:1px solid gray;
}
 
Upvote 0 Downvote
also how would I go about align the text links beginning with List Your Equipment, Online Quote Request, etc. to the top of the div its within, top...I tried creating another div, .top.p.a then appropriately setting the padding and height up, but that didn't seem to work
 
Upvote 0 Downvote
I am not sure that those top links belong on your index page but style the <a> tag to change their appearance.
Code: 
. menu{
	font-size:12px;
	font-family: Verdana, sans-serif;
	text-decoration: none;
	font-weight:bold;
	font-style:normal;
	color: #123456;
}
.menu a{
	font-size:12px;
	font-family: Verdana, sans-serif;
	text-decoration: none;
	font-weight:bold;
	font-style:normal;
	color: #000080;
}
.menu a:hover{
	font-size:12px;
	font-family: Verdana, sans-serif;
	text-decoration: none;
	font-weight:bold;
	font-style:normal;
	color: #0000f0;
}

Keith
 
Upvote 0 Downvote
thanks for the reply, but what the problem Im coming up with is when I view the page in certain browsers my menus are not aligned up, the menu at the top beginning with list your equipment(yeah this is where Im wanting it to be) overlaps to a line below and also the logistics part of my spry menu doesn't show up, its as though the menus are too long for the divs with which they're within.

I've attached my currrent HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Meadow Lark Companies Transportation Brokerage</title>
<style type="text/css">
<!--




.wrapper {
width: 900px;
margin-right: auto;
margin-left: auto;
}
.menu {
background-color: acac93;
overflow: hidden;
background-image: url(images/testbanner4.png);
background-repeat: no-repeat;
}

.top a {
color: #060;
}

.top a:hover {
color: #060;
}

.menu .top {
line-height: 20px;
float: right;
height: 40px;
width: 700px;
}


.menu .Spry {
line-height: 20px;
clear: both;
float: right;
height: 35px;
width: 655px;
border-top:1px solid gray;
}

.splash {
background-color: 686898;
height: 400px;
background-image: url(images/gettycropped2.jpg);
overflow:hidden;
}

.splash h1 {
color: #FFF;
font-size: 18px;
text-align: right;
padding-top: 75px;
padding-right: 40px;
}
.splash .welcome {
font-size: 20px;
color: white;
text-align: right;
padding-right:25px;
}
.splash .main {
text-align: right;
color: white;
padding-right: 25px;
padding-left: 350px;
}
.about .About.Us {
font-size: 20px;
color: white;
padding-left: 10px;
}
.news .News.and.Events {
font-size: 20px;
color: #000;
padding-left: 35px;
}

.splash .deals {
color: #FFF;
font-size: 16px;
text-align: right;
padding-right: 175px;
}

.content {
height: 400px;
overflow: hidden;
}

.about {
background-color: 789978;
float: left;
height: 100%
width: 400px;
background-image: url(images/leftcolumn_background2_new.png);
height: 485px;
width: 488px;
}

.news {
border: 2px solid gray;
float:right;
width:408px;
height:100%;
background-image: url(images/rightcolumn_background3.png);
}
-->
</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
body {
background-image: url(images/test%20background.png);
}
-->
</style></head>

<body>
<div class="wrapper">
<div class="menu"><div class="top"><p><a href=" Your Equipment</a> <a href=" Quote Request</a> <a href=" Booking</a> <a href=" Loads</a> <a href=" Services</a> <a href=" top>
<div class="Spry">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Home</a></li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Flatbed</a>
<li><a href="#">Van</a>
<li><a href="#">Heavy Haul</a>
<li><a href="#">Global</a>
<li><a href="#">LTL</a>
<li><a href="#">Cross Border</a>
</ul>
</li>
<li><a href="#">Customers</a></li>
<li><a href="#">Logistics</a></li>
<li><a href="#">Agents</a></li>
<li><a href="#">Contractors</a></li>
<li><a href="#">Logistics</a></li>
</ul>
</div spry>
</div menu>
<div class="splash"><h1>A FRESH NEW LOOK AT TRANSPORTATION</h1><p class="deals">"No Bad Deals"</p><p class="welcome">Welcome to Our Website</p><p class="main">With over two decades of service, Meadow Lark has offered innovative solutions to any transportation needs with on-demand operational services and advanced technology. Customers, contractors, and agents alike benfit from association with our company. Family owned and operated, Meadow Lark is the permier choice for your shipping requirements</p></div>
<div class="content">
<div class="about">
<h1 class="About Us">About Us</h1></div>
<div class="news"><h1 class="News and Events">News and Events</h1></div>
</div content>
</div><! wrapper ->
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

tyutghf
  • Locked
  • Question
Slanted divs
Replies
0
Views
546
tyutghf
tyutghf
jason.lex
  • Locked
  • Question
crop image to fit in a div box?
Replies
2
Views
157
jason.lex
jason.lex
tyutghf
  • Locked
  • Question
Hide div on input focus
Replies
2
Views
105
tyutghf
tyutghf
ggriffit
  • Locked
  • Question
strange div positioning 1
Replies
9
Views
148
ggriffit
ggriffit
lupidol
  • Locked
  • Question
Positioning elements, how do I do it ?! 2
Replies
2
Views
111
vacunita
vacunita

Part and Inventory Search

Sponsor

Back
Top