Jump to content
Killersites Forums

How to center an object in the center of page.

Recommended Posts

I'm viewing in FX and I do see Coke Studio to the left and the Facebook button to the right - but I don't like the video playing without any means to stop or mute it.


You have all kinds of problems, so. Your doctype is HTML 3.2 -- I've been designing webpages since 1999 or so - and when I started, 4 was out already. Plus, you're misusing tables for layout. Use a proper doctype - Read this: http://www.w3schools.com/tags/tag_DOCTYPE.asp and go with 4.01 strict, and check into using CSS for positioning. Tables are for tabular layout (aka spreadsheets)

Link to post
Share on other sites

Sorry - I looked at the wrong link.


Change this

<div class="medianav"><div class="titile">Coke Studio - Episode 3</div>
<div class="facebook"><iframe src="[url="view-source:http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.funamess.com%2Fcokestudio%2F&layout=button_count&show_faces=false&width=50&action=like&colorscheme=light&height=21"]http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.funamess.com%2Fcokestudio%2F&layout=button_count&show_faces=false&width=50&action=like&colorscheme=light&height=21[/url]" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true" name="I1"></iframe>

To this:

<div class="medianav">Coke Studio - Episode 3<iframe id="fbLike" src="[url="view-source:http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.funamess.com%2Fcokestudio%2F&layout=button_count&show_faces=false&width=50&action=like&colorscheme=light&height=21"]http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.funamess.com%2Fcokestudio%2F&layout=button_count&show_faces=false&width=50&action=like&colorscheme=light&height=21[/url]" scrolling="no" frameborder="0" style="bordehttp://www.killersites.com/community/index.php?/topic/3301-newbie-need-to-align/page__pid__17912__st__0entry17912r:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true" name="I1"></iframe>

Add any styling to the Coke studio text to the medianav class, and also add #fbLike {float: right;} -- and add any other adjustments to move the button where it needs to go to that ID.


That should do it....

Link to post
Share on other sites

Add padding of about 10px to the medianav class and then remove the top padding from the FBLike button. Just keep in mind that the right and left padding will change the width of that division, so you'll have to make adjustments elsewhere.



To get space between the adds and the player, just add a top margin to your adsense class.


the border doesn't reach the bottom of the media player because the player is floated and your .player div holding it is too short. Increase the .player height to about 542px.

Link to post
Share on other sites

I did exactly whatever you told to do. But still the same difference.


Could you do me a favor ? can you design this page for me. I just saw your sites. am really impress with you css work. I just need the help on my this page. then i will exactly know what to do further.

Link to post
Share on other sites

Could you do me a favor ? can you design this page for me. I just saw your sites. am really impress with you css work. I just need the help on my this page. then i will exactly know what to do further.

For free? :rolleyes:

Link to post
Share on other sites

Are you offering to hire me? I'm about to leave on vacation and would be available in August.


Or - you can just look here, I made a few comments trying to explain. Note that I got rid of the entire content div - it isn't needed. The other changes are in the CSS.

body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
color: #000;
background-color: #FFF;

/* AB: Changing this to a set width - just so much easier to work with then flexible width. Also abbreviating the code, and using px for border width instead of just saying 'thin' - makes calculating things easier. removing background color, it's already set in the body tag */
.container {
width: 1000px;
margin: 0 auto;
border-right: 2px solid #e6e6e6;
border-left: 2px solid #e6e6e6;


.adsense {
width: 980px;
height: 90px;
padding: 10px;
text-align: center;


/* I"m removing the float - not needed. Also removing background color - no need to mention it again. */
.player {
width: 640px;
height: 512px;
border: medium solid #C0C0C0;
margin: 15px 180px;


.medianav {
/* removed the height, added padding - and added the -2px margin for the botton to balandce things out. */
background-color: #333333;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
color: #FFF;
padding: 15px;
#fbLike {
float: right;
margin-top: -2px;



Link to post
Share on other sites

Not really - the real experts here are other people. I am, however, really close to having the basics down pat :rolleyes:

"having the basics down pat". That's the key. The basics!!! It doesn't matter if you use Dreamweaver, Expression Web or plane ol' notepad, without the basics the tools (software programs) are useless.

Edited by newseed
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...