View Full Version : div problems


netaholic
09-18-2005, 07:07 PM
http://www.geocities.com/trigon0metry/newlayout.html

On my site, i have an iframe. page in the iframe has a div with the width of 520 pixels, and the div is centered, and has a left border and a right border

at the same time, the iframe has a width of 520 pixels, however it does not display only the div- it displays some of the bg color on either side. how can I make it so that the iframe displays only the div?

MaGiCSuN
09-18-2005, 08:01 PM
on Welcome.html change this:


<body bgcolor="#FDC9E5">
<!-- following code added by server. PLEASE REMOVE -->
<!-- preceding code added by server. PLEASE REMOVE -->
<center><DIV style="BORDER-RIGHT: #000000 1px solid;

BACKGROUND: #fdc9e5;
LEFT: #000000 5px solid;
BORDER-LEFT: #000000 1px solid;


WIDTH: 520 px;

>

to this

<body bgcolor="#FDC9E5" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
<center><DIV style="BORDER-RIGHT: #000000 1px solid; BACKGROUND-COLOR: #fdc9e5; BORDER-LEFT: #000000 1px solid; WIDTH: 520px;">

Love,
Mirna

netaholic
09-18-2005, 09:50 PM
that didn't do anything, except mess up my font. lookie (http://www.geocities.com/trigon0metry/Welcome.html)

full site (http://www.geocities.com/trigon0metry/newlayout.html)

MaGiCSuN
09-19-2005, 09:41 AM
font has nothing to do with the code i edited. Maybe that's why it shows now, because your code was wrong before, so i didn't showed the font problem :)

<font face="franklin gothic medium" size="1 pt">

remove "pt" since values are only used when using CSS, and not HTML

also remove the <center> tags. And see if that helps ... becuase you have it in an iframe you don't really need to center it

also change your iframe code to this:


<IFRAME name="blog" src="Welcome.html" width="520" height="400" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="auto" allowtransparency="true" style="FILTER: chroma(color=#72220A)"></IFRAME>

Love,
Mirna

netaholic
09-19-2005, 09:28 PM
Wow, I feel so bad because you're being really so helpful bit it's sitll not working! =(. For now what I did is I set the div width to a value smaller than the iframe width which doesnt look half bad, but now I'm really curious why it doesnt work. I'm trying to recall what I did that caused this change, and I'm pretty sure that it worked fine until I correctly coded the css file (which is why my links werent working...from earlier post). after that, the div layers got all messed up.

Any thoughts? thank you so much for your patience!!!!

MaGiCSuN
09-20-2005, 09:54 AM
i really have NO idea why it keeps giving that space in the iframe on the left. But here's another way to do so:

Welcome.html


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

<html>
<head>
<title>Untitled</title>
<LINK href="triggcssversion3.css" rel="stylesheet" type="text/css">
</head>

<body bgcolor="#FDC9E5" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">

<br><font face="franklin gothic medium" size="1">
<p><center><img src="http://img.photobucket.com/albums/v326/ge0metry/welcomepink1.jpg" border="1"></center>
<p>
Welcome to the improved version of <b>Trigon0metry</b>. I completely re-did this site because I didn't like something about the old version that I couldn't quite put my finger on. The instant I made this layout, I said to myself "this is it". For a long time I couldn't come up with a layout that satisfied me, and I'm pretty sure that this is it.
<p>
Seeing that I could not come up with an appropriate form of navigation, it is temporarily located below. If I like it like that, I will keep it there.
<p>


<br>
<a href="blog.html"> Recording </a> my life. Aka my blog
<br>
The Girl who lives
<br>
My own little corner on my own little web
<br>
Visual diary
<br>
Write it down, remember it forever
</font>
<p>
<p> <img src="http://img.photobucket.com/albums/v326/ge0metry/juliehot1.jpg" alt="Image hosted by Photobucket.com" border="1">
<img src="http://img.photobucket.com/albums/v326/ge0metry/juliecamp.jpg" alt="Image hosted by Photobucket.com" border="1">
</body>
</html>

next post will have newlayout.html in it and the css

Love,
Mirna

MaGiCSuN
09-20-2005, 09:56 AM
newlayout.html


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style type="text/css">
body{
scrollbar-face-color: #FDC9E5;
scrollbar-arrow-color: #FDC9E5;
scrollbar-highlight-color:#6E6E6A;
scrollbar-3dlight-color: #FDC9E5;
scrollbar-shadow-color: #FDC9E5;
scrollbar-darkshadow-color: #FDC9E5;
scrollbar-track-color: #FDC9E5;
cursor: e-resize;
overflow-x: hidden;
}

table table table td { filter:alpha(opacity=65); -moz-opacity:0.50; opacity:0.50; -khtml-opacity:0.50; }

A:link{color:#6E6E6A;text-decoration:underline}
A:visited{color:#6E6E6A;text-decoration:underline}
A:active{color:#6E6E6A;text-decoration:underline}
A:hover{color:#6E6E6A;text-decoration:none;cursor:crosshair}

.blog { font-family: tahoma; width:100%; font-size: 7pt; color: #000000; background-color: #ff9933; border: #ff0000; border-style:dotted; font-weight: normal; border-width: 1px; text-align: left; align:left; }

body, div, table, br {color:#000000; font-face:comic sans ms; font-size:7pt; line-height:8pt; margin-top:0px; margin-left:6px; margin-right:4px; margin-bottom:0px}
</style>
<title>Untitled</title>
</head>
<body background="http://img.photobucket.com/albums/v326/ge0metry/plusback1.jpg">

<center>
<img src="http://img.photobucket.com/albums/v326/ge0metry/ineedyouhearder.jpg" border="1">
<IFRAME name="blog" src="Welcome.html" width="502" height="600" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="auto" allowtransparency="true" style="FILTER: chroma(color=#72220A); BORDER-RIGHT: #000000 1px solid; BORDER-LEFT: #000000 1px solid;"></IFRAME>
</center>
</body>
</html>

and in your .css file add this in the BODY section:

margin: 0px; padding: 0px;

to make sure it will not add any spaces :)

Love,
Mirna