473,320 Members | 1,920 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

avoiding white space between elements

hello,
I've made a template which has the layout I want, but there is an undesired
white space between the left elements and the right column. How can I remove
it?
Thank you
Bye!!

Here's the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<style type="text/css">
div.container
{
width:100%;
margin:0px;
border:1px solid gray;
/*line-height:150%;*/
float:left;
}
div.header
{
border: 1px solid #000000;
padding:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: none;
height: 131px;
width: 561px;
float:left;
}
div.titoli
{
border: 1px solid #000000;
padding:0px;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
height: 20px;
width: 561px;
float:left;
}
div.right
{
border: 1px solid #000000;
padding:0px;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
position:relative;
width: 239px;
height: 600px;
float:right;
}
div.contenuti
{
/*border: 2px solid #000000;*/
padding:0;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
}
</style>
<title>Untitled</title>
</head>
<div class="container">
<div class="right"></div>
<div class="header"></div>
<div class="titoli"></div>
<div class="contenuti"></div>
</div>
</html>

--
elimina unsampdoriano per rispondere via email
Jul 21 '05 #1
1 4317
I'm not sure what you're trying to do - did you want the layout to be fixed
or fluid (i.e. grow to the size of the browser window). You've specified a
fixed width for the header and title, and the side bar on the right. As the
container has a fluid width of 100%, its the container that will grow to the
size of the window, which is why you get the gap between the two.

If you want a fixed width, then you could change the container width from
100% to 804px (width of header + borders + width of right sidebar +
borders). However, this isn't very good, as it would be too wide for users
running lower resolutions.
If you want a fluid layout, then you have to decide if the header, contents,
or right sidebar, or a combination should grow horizontally to fit the
browser window.

I recommend you buy 'Web Standards Solutions: The Markup and Style
Handbook'. It's got a chapter on layouts which are very similar to what you
are trying to do.

P.S. You'll want to use a proper DOCTYPE as well, otherwise browsers will go
into quirks mode, and you'll get all sorts of headaches.

"Generale Cluster" <al***************@unsampdorianosoftmasters.net> wrote in
message news:cu**********@newsreader.mailgate.org...
hello,
I've made a template which has the layout I want, but there is an
undesired
white space between the left elements and the right column. How can I
remove
it?
Thank you
Bye!!

Here's the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<style type="text/css">
div.container
{
width:100%;
margin:0px;
border:1px solid gray;
/*line-height:150%;*/
float:left;
}
div.header
{
border: 1px solid #000000;
padding:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: none;
height: 131px;
width: 561px;
float:left;
}
div.titoli
{
border: 1px solid #000000;
padding:0px;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
height: 20px;
width: 561px;
float:left;
}
div.right
{
border: 1px solid #000000;
padding:0px;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
position:relative;
width: 239px;
height: 600px;
float:right;
}
div.contenuti
{
/*border: 2px solid #000000;*/
padding:0;
margin:0px;
color:white;
background-color:gray;
background-position:top left;
background-repeat: repeat-y;
}
</style>
<title>Untitled</title>
</head>
<div class="container">
<div class="right"></div>
<div class="header"></div>
<div class="titoli"></div>
<div class="contenuti"></div>
</div>
</html>

--
elimina unsampdoriano per rispondere via email

Jul 21 '05 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: StopBsod | last post by:
Hello group, I use XSLT to output a unix shell script based on the content of an XML file : The XSLT : <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">...
17
by: Stanimir Stamenkov | last post by:
Is it possible to make two inline elements to appear adjacent stripping any white space appearing in between in the source? Example: <span class="adj">1</span> <span class="adj">2</span>...
5
by: Applebrown | last post by:
Hello, basically, I'm just learning intermediate CSS and trying to convert my old table webpage completely to CSS. Hoorah, right? Well, it's not quite going as planned. It's an extremely simple...
20
by: Stephen Poley | last post by:
People in these groups, and on web-pages, not infrequently suggest that it is worthwhile cutting down on white-space and comments in HTML and CSS in order to reduce loading times. I and others have...
3
by: Simon Dean | last post by:
Hello! Im looking to try and get into CSS for formatting my sites. Seems like a nice premise, and should allow easier design for the future. But gees, Im having a hard time of it. I would...
38
by: Xah Lee | last post by:
sometimes i wish to add white space in <p> as to achived effects similar to tab. what should i do? using empty image seems the sure way but rather complicated. (and dosen't change size with...
2
by: shagy | last post by:
Hi, I'm having a problem with a <select><option> which has white space in values... When I post the data I only get the first word (up to the white space). "Testing white space" becomes...
4
by: Don Miller | last post by:
When an ASP.NET 2.0 web page is rendered with multiple web controls hidden from view (.visible=false) there is a noticeable gap between a rendered element (like a table) and the next visible...
1
by: bdbeames | last post by:
I am currently getting some forecast data from a web site using (file_get_contents), then I'm using explode to put the string in an array, which I am then parsing. The trouble is when I use...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.