Hello everyone, I'm new here and desperately in need of some help.<br />
<br />
I have a LiveJournal account in which I created a custom style. I based it on a template I created awhile back, and I'm at a loss as to what I did or didn't do that's causing me problems.<br />
<br />
I want to have the <div> #container pushed over to far left margin, but instead it is centering in the middle of the page. I've tried changing the width, I've tried changing the float, but nothing seems to help.<br />
<br />
Here is a link where you can view the page (without the additions via LJ code): <!-- m --><a class="postlink" href="http://michele.thebumbargers.com/site_style1.htm">http://michele.thebumbargers.com/site_style1.htm</a><!-- m --> (and if visible, here's the actual page with LiveJournal code(s) active: <!-- m --><a class="postlink" href="http://www.livejournal.com/customview.cgi?user=fikgirl&styleid=340523">http://www.livejournal.com/customview.c ... eid=340523</a><!-- m -->)<br />
<br />
Like I said, I want the #container <div> as far to the left as possible and I can't seem to make it happen.<br />
<br />
Thank you in advance!<!--content-->i have no idea what you're talking about<br />
<br />
position:absolute;<br />
<br />
???<!--content-->not the most usefull answer pyrexyn
<br />
<br />
if you give the container div a border you will see that it IS as far over to the left as you have allowed it with your coding, give the container a float:left; if you want it over further remove/reduce any left any left padding/margin for both content and container divs.<br />
<br />
Just like tables having the borders ON while you code makes things alot easier!<br />
<br />
welcome to the forums by the way
<!--content-->Just in case I'm confusing people and no one understands my question, I've attached a screenshot of my actual page, and I'm going to elaborate a bit:<br />
<br />
If you look at the picture, you will see that there is an area on the left, which has journal entries in it, and a sidebar on the right which is full of unchanging information.<br />
<br />
There is a wide gap on the left between the left side of the page and the border of the journal entry boxes. I want to get rid of that gap and maybe have it only be a few pixels wide.<br />
<br />
I can't figure out how to do that.<br />
<br />
Here are the relative parts of the code:<br />
<br />
<br />
<style type="text/css"><br />
<br />
body {<br />
background: #01235A;<br />
color: #ffffff;<br />
margin: 0;<br />
padding: 0;<br />
text-align: center;<br />
}<br />
<br />
#container {<br />
background: transparent;<br />
color: #ffffff;<br />
height: auto;<br />
padding: 3px;<br />
text-align: left;<br />
width: 85%;<br />
\width: 85%;<br />
w\idth: 85%;<br />
margin: 2px;<br />
margin-left: auto;<br />
margin-right: auto;<br />
}<br />
<br />
#banner {<br />
height: 100px;<br />
padding: 5px;<br />
margin-bottom: 5px;<br />
background: transparent;<br />
color: #000000;<br />
}<br />
<br />
#content {<br />
padding: 5px;<br />
background: transparent;<br />
color: #ffffff;<br />
float: left;<br />
<br />
}<br />
<br />
#sidebar-a {<br />
<br />
float: left;<br />
width: 200px;<br />
\width: 210px;<br />
w\idth: 200px;<br />
margin: 0;<br />
margin-left: 5px;<br />
padding: 5px;<br />
background: transparent;<br />
color: #C8DCF4;<br />
border: 1px #C8DCF4 dashed;<br />
}<br />
. . . .<br />
<br />
<body><br />
<div id="container"><br />
<br />
<div id="banner"></div><br />
<br />
<br />
<div id="content"><br />
<!-- INSERT LJ SPECIFIC TAGS --><br />
%%events%%<br />
<br />
<p align="center">%%skiplinks%%<br />
</p><br />
<!-- END OF LJ SPECIFIC TAGS --><br />
</div><br />
<br />
<br />
<div id="sidebar-a"><br />
<!-- Begin Sidebar --><br />
Miscellaneous Side Bar Information<br />
</div><br />
<!-- End Sidebar --><!--content-->Oops!<br />
<br />
Thanks for the reply, le0024. I posted additional information while you were posting, it seem. =:O <br />
<br />
I will try the float: left; and pulling out the margin settings again.<br />
<br />
Thanks!<!--content-->hehe, often happens
<!--content-->add <br />
<br />
left: 0;<br />
position: absolute<br />
<br />
to the container selector<!--content-->
<br />
I have a LiveJournal account in which I created a custom style. I based it on a template I created awhile back, and I'm at a loss as to what I did or didn't do that's causing me problems.<br />
<br />
I want to have the <div> #container pushed over to far left margin, but instead it is centering in the middle of the page. I've tried changing the width, I've tried changing the float, but nothing seems to help.<br />
<br />
Here is a link where you can view the page (without the additions via LJ code): <!-- m --><a class="postlink" href="http://michele.thebumbargers.com/site_style1.htm">http://michele.thebumbargers.com/site_style1.htm</a><!-- m --> (and if visible, here's the actual page with LiveJournal code(s) active: <!-- m --><a class="postlink" href="http://www.livejournal.com/customview.cgi?user=fikgirl&styleid=340523">http://www.livejournal.com/customview.c ... eid=340523</a><!-- m -->)<br />
<br />
Like I said, I want the #container <div> as far to the left as possible and I can't seem to make it happen.<br />
<br />
Thank you in advance!<!--content-->i have no idea what you're talking about<br />
<br />
position:absolute;<br />
<br />
???<!--content-->not the most usefull answer pyrexyn
<br /><br />
if you give the container div a border you will see that it IS as far over to the left as you have allowed it with your coding, give the container a float:left; if you want it over further remove/reduce any left any left padding/margin for both content and container divs.<br />
<br />
Just like tables having the borders ON while you code makes things alot easier!<br />
<br />
welcome to the forums by the way
<!--content-->Just in case I'm confusing people and no one understands my question, I've attached a screenshot of my actual page, and I'm going to elaborate a bit:<br /><br />
If you look at the picture, you will see that there is an area on the left, which has journal entries in it, and a sidebar on the right which is full of unchanging information.<br />
<br />
There is a wide gap on the left between the left side of the page and the border of the journal entry boxes. I want to get rid of that gap and maybe have it only be a few pixels wide.<br />
<br />
I can't figure out how to do that.<br />
<br />
Here are the relative parts of the code:<br />
<br />
<br />
<style type="text/css"><br />
<br />
body {<br />
background: #01235A;<br />
color: #ffffff;<br />
margin: 0;<br />
padding: 0;<br />
text-align: center;<br />
}<br />
<br />
#container {<br />
background: transparent;<br />
color: #ffffff;<br />
height: auto;<br />
padding: 3px;<br />
text-align: left;<br />
width: 85%;<br />
\width: 85%;<br />
w\idth: 85%;<br />
margin: 2px;<br />
margin-left: auto;<br />
margin-right: auto;<br />
}<br />
<br />
#banner {<br />
height: 100px;<br />
padding: 5px;<br />
margin-bottom: 5px;<br />
background: transparent;<br />
color: #000000;<br />
}<br />
<br />
#content {<br />
padding: 5px;<br />
background: transparent;<br />
color: #ffffff;<br />
float: left;<br />
<br />
}<br />
<br />
#sidebar-a {<br />
<br />
float: left;<br />
width: 200px;<br />
\width: 210px;<br />
w\idth: 200px;<br />
margin: 0;<br />
margin-left: 5px;<br />
padding: 5px;<br />
background: transparent;<br />
color: #C8DCF4;<br />
border: 1px #C8DCF4 dashed;<br />
}<br />
. . . .<br />
<br />
<body><br />
<div id="container"><br />
<br />
<div id="banner"></div><br />
<br />
<br />
<div id="content"><br />
<!-- INSERT LJ SPECIFIC TAGS --><br />
%%events%%<br />
<br />
<p align="center">%%skiplinks%%<br />
</p><br />
<!-- END OF LJ SPECIFIC TAGS --><br />
</div><br />
<br />
<br />
<div id="sidebar-a"><br />
<!-- Begin Sidebar --><br />
Miscellaneous Side Bar Information<br />
</div><br />
<!-- End Sidebar --><!--content-->Oops!<br />
<br />
Thanks for the reply, le0024. I posted additional information while you were posting, it seem. =:O <br />
<br />
I will try the float: left; and pulling out the margin settings again.<br />
<br />
Thanks!<!--content-->hehe, often happens
<!--content-->add <br /><br />
left: 0;<br />
position: absolute<br />
<br />
to the container selector<!--content-->