Connecting Tech Pros Worldwide Forums | Help | Site Map

Please Help Me to Expand the Margins on my Blog

Newbie
 
Join Date: Oct 2008
Posts: 3
#1: Oct 4 '08
I'm a member of a social network and I would like to expand the margins in the template I have.

There is a HTML reader to help design your page.

Please tell me the code for expanding the margins within a template. The template has a 4 inch white space on the left side of the page, that is driving me crazy. I would like the text and layout to expand wider. I only know the basics of HTML.

Here is my web page:

http://www.blackplanet.com/Curiosity336/

Thank you in advance
codegecko's Avatar
Moderator
 
Join Date: May 2007
Location: United Kingdom
Posts: 395
#2: Oct 4 '08

re: Please Help Me to Expand the Margins on my Blog


Hi there,

Firstly, welcome to Bytes.com. Please be sure to take a read through the Posting Guidelines and FAQs.

This forum is predominantly for helping individuals with either architectural design guidance for software development or for assisting with debugging individual lines of code that you have already written.
As you don't appear to have made any attempt at altering the layout yourself, I suggest you take a look at the following resources here at W3Schools as they have some wonderful tutorials for beginners to this technology.

Once you understand what you're trying to achieve and you've given it a good shot, then we'll be more than happy to help out with any code you've written. But we won't write your code for you.

codegecko
Moderator
eWish's Avatar
Moderator
 
Join Date: Jul 2007
Location: Arkansas
Posts: 900
#3: Oct 4 '08

re: Please Help Me to Expand the Margins on my Blog


You will need to find a way to determine what CSS to edit that is being used. Without seeing any code it is hard to say.

--Kevin
Expert
 
Join Date: Aug 2008
Posts: 397
#4: Oct 4 '08

re: Please Help Me to Expand the Margins on my Blog


Quote:

Originally Posted by eWish

You will need to find a way to determine what CSS to edit that is being used. Without seeing any code it is hard to say.

--Kevin

Open his CSS files in the Firefox Web Developer extension. Or download the HTML, CSS, and images in Opera. Or view the CSS using the absolute paths to them in the head of the source document.

All of which, imho, is a lot easier than trying to debug CSS/(X)HTMLposted to the forum by pasting between code tags-- particularly when done by folks who either don't know what they are doing, or guessing at where they think the problem lies.
Expert
 
Join Date: Aug 2008
Posts: 397
#5: Oct 4 '08

re: Please Help Me to Expand the Margins on my Blog


Quote:

Originally Posted by enwriter

I'm a member of a social network and I would like to expand the margins in the template I have.
http://www.blackplanet.com/Curiosity336/

That may be easier said than done. It is a complex CMS (Content Management System), with complex CSS, and an even more confusing and complex array of inline styles.

All I can suggest follows:

The block "Members Dock" that is a against the right rail is an "iframe." Its positioning is controlled by an inline style. Find the page(s) having the member dock and...

1/ Insert this to enclose the page and the dock. Put it immediately above the inline style for the iframe. And modify the CSS positioning of the iframe as shown.
Expand|Select|Wrap|Line Numbers
  1. <div style="width: 1050px; border: 1px solid red;margin: 0 auto" id="stuff">
  2.  
  3. <div style="width: 1050px; border: 1px solid red;margin: 0 auto" id="stuff">
  4.  
  5.  
  6. <iframe style="border-width: 0pt; position: absolute; visibility: visible; width: 10em; height: 10em; top: -110px; left: -110px;" id="_yuiResizeMonitor" src="data:text/html;charset=utf-8,%3Chtml%3E%3Chead%3E%3Cscript%20type%3D%22text%2Fjavascript%22%3Ewindow.onresize%3Dfunction%28%29%7Bwindow.parent.YAHOO.widget.Module.textResizeEvent.fire%28%29%3B%7D%3Bwindow.parent.YAHOO.widget.Module.textResizeEvent.fire%28%29
  7. %3B%3C%2Fscript%3E%3C%2Fhead%3E%3Cbody%3E%3C%2Fbody%3E%3C%2Fhtml%3E">
  8.  
  9. </iframe><div style="visibility: visible; z-index: 4; top: 205px; /* delete this----> left: 1309px*/  /* add this---->*/right:250px;" id="memberDock_c" class="yui-panel-container shadow show-scrollbars dock">
  10.  
Then close the div that was added, by adding </div> immediately before the very last
Expand|Select|Wrap|Line Numbers
  1. <script src"...">
  2.  
tag at the very bottom of the page.

Good luck and best wishes for success...
Newbie
 
Join Date: Oct 2008
Posts: 3
#6: Oct 5 '08

re: Please Help Me to Expand the Margins on my Blog


Thank you everyone for your help, I do see I'm in above my head, lol.

I didn't realize you give advice mainly for advance HTML coding. It does inspire me though, because I don't understand the terminology being used, and I think it's something I should learn.

Than you
Expert
 
Join Date: Aug 2008
Posts: 397
#7: Oct 5 '08

re: Please Help Me to Expand the Margins on my Blog


Quote:

Originally Posted by enwriter

I didn't realize you give advice mainly for advance HTML coding.

Who said that? Or where does it say that?

If you are interested in learning (X)HTML and CSS, this is one of many online resources you might consider:
HTML and CSS Tutorials
Newbie
 
Join Date: Oct 2008
Posts: 3
#8: Oct 7 '08

re: Please Help Me to Expand the Margins on my Blog


Quote:

Originally Posted by David Laakso

Who said that? Or where does it say that?

If you are interested in learning (X)HTML and CSS, this is one of many online resources you might consider:
HTML and CSS Tutorials

Thank you,

I found another great site Tizag.com I'm actually up to the "font chapter".

I'm still going to come on here and see if I can learn, I would feel like a computer genius if I can read this. lol
Expert
 
Join Date: Aug 2008
Posts: 397
#9: Oct 7 '08

re: Please Help Me to Expand the Margins on my Blog


Quote:

Originally Posted by enwriter

Thank you,

I found another great site Tizag.com I'm actually up to the "font chapter".

I'm still going to come on here and see if I can learn, I would feel like a computer genius if I can read this. lol

Good. You may find this css reference and this layout tutorial helpful.
codegecko's Avatar
Moderator
 
Join Date: May 2007
Location: United Kingdom
Posts: 395
#10: Oct 8 '08

re: Please Help Me to Expand the Margins on my Blog


Hi again,

One thing to bear in mind is that the system that this site uses will throw code in there which you cannot necessarily control, change, or do anything whatsoever about. So if you are determined to pimp your profile, you have to learn to work around this limitation.

The two things you have to do are:
  1. Find the HTML elements that you want to move (make sure you find the beginning and end tags correctly). I suggest downloading Firefox and getting the DOM Inspector extension, which gives you a way of clicking parts of the page and it showing up in a tree-like navigation form so you can see where it fits in the page and code.
  2. Learn CSS and how it gets applied to HTML (again, the DOM Inspector can help here). I would suggest saving your page as a copy on your hard disk, so then you can change the styles and learn how the page is designed and built up using CSS style rules.

At that point you should have a fairly good understanding of HTML and CSS, and what you want to do and how to go about it. If you get stuck with any of the concepts/techniques of CSS then you can always ask us here, we're a friendly bunch :-)

codegecko
Reply