Help with Layout Options

[misstalisaxo]

Im making div layout and i put my blogs on there but for some reason no matter what i do i cant get the height to change i posted a link to my xanga so u can see what im talking about. i want the blogs to fit right where the notebook is.

my xanga

this is my code so far

CODE

<!-- begin code provided by createblog.com -->
<style type="text/css">
/*Name of Your Skin*/
/*by YOU*/
body {
background-image:url(http://cbimg9.com/layouts/08/11/32694ab.png);
background-repeat: repeat-y-x;
background-color: #COLOR CODE;
scrollbar-face-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #ffffff;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #000000;
scrollbar-arrow-color: #pink;
}

#rblEprops, #pnlEnabled table, #pnlEprops table {
width: auto !important;
}

table.blogbody {
width:500px;
font-family: Arial;
font-weight: none;
font-size: 12pt;
color: #000000;
text-align: justify;
padding: 0px;
margin-top: 2px;
}
div.smalltext{
width: 50px;
padding: 3px;
text-align: left;
}
.caption, .blogheader {
width: 380px;
padding: 3px;
font-family: arial;
font-size: 16pt;
text-align: center;
color: #000000;
background-color: #000000;
text-transform: lowercaps;
margin-top: 10px;
}

P, B, I, TD, TH
{font-family: FONT; color: #000000; font-size: 8pt; }
A:link, A:visited, A:active
{color:#000000; text-decoration:none; font-size:8pt;}
a:hover
{text-decoration: underline; color:pink; font-size: 8pt; );}
b, strong, i, u, {
/* edit colors when bold italic underline */
font-family: arial;
font-size: 8pt;
color: #000000;
font-weight: bold;
text-transform: lowercaps;
</style>

<style type="text/css">
.#rblEprops{display:none;}
#pnlEnabled table, #htmleditor, #lblTimeZone, #pnlEprops, #rblEprops
/* width of the comment page */
{width:245px;}
.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer
{display: none;}

</style>
<div style="position:center; margin-left: 98px;margin-top: 100px;border: 0px solid CODE; width: 800px; height: 500px;background-image:url(http://i748.photobucket.com/albums/xx122/misstalisaxo/middleforlayout-1.jpg); overflow: hidden"></style>

<div style="
overflow: auto;
width: 500px;
height: 500px;
margin-top: 40px;
margin-left: 200px;">
</style>
<!-- end code provided by createblog.com -->

Reason for edit: Please put codes in "[codebox][/codebox]" Thanks. -Nat

[Mickey]

There's this bit near the end:

CODE

<div style="
overflow: auto;
width: 500px;
height: 500px;
margin-top: 40px;
margin-left: 200px;">

Adjust the height value.

[misstalisaxo]

i have changed the height many times but it never works :[ it keeps the scrollbox longer than what i want.

[Mickey]

Look for this bit:

CODE

<div style="position:center; margin-left: 98px;margin-top: 100px;border: 0px solid CODE; width: 800px; height: 500px;background-image:url(http://i748.photobucket.com/albums/xx122/misstalisaxo/middleforlayout-1.jpg); overflow: hidden">

Have you changed the height on that bit as well?

[misstalisaxo]

Look for this bit:

CODE

<div style="position:center; margin-left: 98px;margin-top: 100px;border: 0px solid CODE; width: 800px; height: 500px;background-image:url(http://i748.photobucket.com/albums/xx122/misstalisaxo/middleforlayout-1.jpg); overflow: hidden">

Have you changed the height on that bit as well?

no because that bit is the middle pic not the blogs. i want the blogs to be smaller than this so they will fit inside the notebook on the pic.

[Mickey]

With the first code I posted, was the value you changed it to lower than 460px? Because that's the height of the DIV, and you may need to make it lower than that before you see any changes.

[misstalisaxo]

ok finally got it to work :]
thanks.



is there a way to hide the scroll bar? and is there a way to make it lokk right in all browsers? like when i use google chrome the div is out of place.

Reason for edit: Please use the Edit button instead of double-posting. - Mike

[Mickey]

Change overflow: auto; to overflow: hidden;. Then replace this bit:

CODE

margin-top: 40px;
margin-left: 200px;

With this:

CODE

top: 40px;
left: 50%;
margin-left: 200px;

Adjust the top and margin-left values only.

[misstalisaxo]

thanks. how can i put another box or module on there for my about me?
i went to the how to make an xanga layout but when i use the thing it gives it puts the about me in the same scroll box as my blogs