Go Back  HTML Forums - Free Webmaster Forums and Help Forums > WEBSITE DEVELOPMENT > HTML / XHTML
User Name:
Password:
 

Reply
Thread Tools   Display Modes
  View First Unread
 
Old 02-17-2012, 04:58 PM
  #1
gibby
Paladin (Level 15)
 
Join Date: Sep 2004
Posts: 344
iTrader: (0)
gibby is on a distinguished road
space between divs

Hello,

Please have a look at this site: http://www.shahspace.com/bow/home.html

As you can see, I have two div colored pink and some space between them and around them. I'd like to get rid of all spacing but I can't.

Here's the code:

Code:
<html>

<head>

<title>The Bow Tower</title>

<style>

body
{
background: url('content_bg.jpg');
background-repeat: repeat-x;
}

#textdiv
{
width: 230px;
height: 100%;
background-color: #ffaaaa;
float: left;
padding: 0;
margin: 0;
}

#imgdiv
{
width: 250px;
height: 100%;
background-color: #ffaaaa;
padding: 0;
margin: 0;
}

span
{
font-size: 18pt;
font-family: verdana;
font-weight: bold;
}

</style>

</head>

<body>

<div id="textdiv">
<br>
<br>
<span>
The Bow Tower<br>
</span>
<br>
<br>
<ul>
<li><a href="services.html">Services</a></li>
<li><a href="information.html">Information</a></li>
<li><a href="health_safety.html">Health and Safety</a>
<li><a href="index.html">Index</a>
</ul>
</div>

<div id="imgdiv"><img align=right src="bow tower.jpg" border=0></div>

</tr>
</table>

</body>
</html>
What can I do to get rid of the spacing (I'm working in IE9).
gibby is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-17-2012, 05:27 PM
  #2
Pegasus
Mama Hen
 
Pegasus's Avatar
 
Join Date: Nov 2001
Location: 35 South of Santa Claus
Posts: 26,633
iTrader: (0)
Pegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud of
Use a complete doctype and have your img src as a one-word filename. No spaces are allowed in filenames.
Pegasus is online now   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-17-2012, 05:55 PM
  #3
howtodoablog
Aspirant (Level 2)
 
howtodoablog's Avatar
 
Join Date: Feb 2012
Posts: 11
iTrader: (0)
howtodoablog is an unknown quantity at this point
Try putting a float:left in the #imgdiv css

#imgdiv
{
width: 250px;
height: 100%;
background-color: #ffaaaa;
padding: 0;
margin: 0;
float:left
}
howtodoablog is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-17-2012, 06:01 PM
  #4
gibby
Paladin (Level 15)
 
Join Date: Sep 2004
Posts: 344
iTrader: (0)
gibby is on a distinguished road
Quote:
Originally Posted by howtodoablog View Post
Try putting a float:left in the #imgdiv css

#imgdiv
{
width: 250px;
height: 100%;
background-color: #ffaaaa;
padding: 0;
margin: 0;
float:left
}
Perfect! That gets rid of the space between the divs but what about around the divs?

Just to note: These divs are in an iframe which is in a table cell.

The outer page looks like this:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<html>

<head>
<title>H&R Properties</title>

<style type="text/css">
table.master
{
height: 100%;
}

td.banner
{
height: 100px;
text-align: center;
}

span.banner
{
font-size: 24pt;
}

td.news
{
width: 200px;
padding-top: 10px;
text-align: center;
}

iframe.news
{
width: 100%;
height: 100%;
}

td.menuandcontent
{
width: 531px;
}

table.menuandcontent
{
width: 100%;
height: 100%;
}

td.menu
{
height: 50px;
background: url('menu_bg.jpg');
text-align: center;
}

td.content
{
text-align: left;
}

iframe.content
{
width: 100%;
height: 100%;
}


</style>

</head>

<body>

<table class="master" cellspacing=0 cellpadding=0 border=0>

<tr><td colspan=2 class="banner">
<span class="banner">
<img src="H&Rbanner.jpg" border=0></span></td></tr>

<tr>

<td class="news">
<iframe class="news" src="news.html" scrollable=yes frameborder=no></iframe>
</td>

<td class="menuandcontent">
<table class="menuandcontent" cellspacing=0 cellpadding=0 border=0>

<tr>
<td class="menu">

<table cellspacing=0 cellpadding=0 border=0>
<tr>
<td><img src="home.jpg" border=0></td>
<td><img src="services.jpg" border=0></td>
<td><img src="information.jpg" border=0></td>
<td><img src="health_safety.jpg" border=0></td>
<td><img src="index.jpg" border=0></td>
</tr>
</table>

</td></tr>

<tr>
<td class="content">
<iframe class="content" src="content.html" srollable=yes frameborder=0></iframe>
</td>
</tr>

</table>
</td>

</tr>
</table>

</body>
</html>
gibby is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-17-2012, 06:09 PM
  #5
howtodoablog
Aspirant (Level 2)
 
howtodoablog's Avatar
 
Join Date: Feb 2012
Posts: 11
iTrader: (0)
howtodoablog is an unknown quantity at this point
try putting this for the page inside the iframe

body
{
background: url('content_bg.jpg');
background-repeat: repeat-x;
margin:0;
padding:0

}
howtodoablog is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-22-2012, 09:15 AM
  #6
gibby
Paladin (Level 15)
 
Join Date: Sep 2004
Posts: 344
iTrader: (0)
gibby is on a distinguished road
Thanks howto, that worked.
gibby is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Reply
KEEP TABS
SPONSORS
 
Boxedart

 
 


 
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
  
 
 
 



 
  POSTING RULES
 
 
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Thread Tools
Display Modes

Forum Jump

 

All times are GMT -5. The time now is 12:00 AM.

   

Mascot team created by Drawshop.com | Web Hosting

Powered by vBulletin® Version 3.6.7
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.

Server Monitoring by ENIACmonitor 0.01
HTMLforums.com © Big Resources, Inc. Web Design by BoxedArt.com
vRewrite 1.5 beta SEOed URLs completed by Tech Help Forum and Chalo Na.