What CSS code is used adjusting or removing a top margin of an HTML doc (that resides within a frame)?

Question

I have 1 photo and a single large print word side by side inside a short frame that stretches across the screen. When their doc is loaded, they are automatically pushed downwards by what might be some kind of default top margin. Consequently, their bottom parts are partially hidden.

BTW if I manually force them upwards, they can fit within the frame where there is space above and below.

What CSS codes is necessary to get them vertically centered or to remove the top margin?

Answer 1

The problem is with the frame

use frame attribute



marginwidth="0" marginheight="0"

Answer 2

Here is your new CSS Code: div { background-color:green; border:2px solid black; } .border { height:500px; width:100px; } #right { float:right; } #left { float:left; } #bottom { height:100px; width:99.95%; clear:both; padding-top:50px; padding-left:50px; } #bottom a { display:inline; align:center; background-color:red; font-size:50px; } #bottom a:first-child { margin-right:500px; } ====================== The reason is you put the hyperlink inside id bottom, so you need to use padding instead of margin. The margin use to clear the area outside the border, the padding use to clear the area inside the border. So you cannot use margin with tag. Also you shouldn't use div a. That is completely wrong, you need to use #bottom a instead of div a. The reason is when you use #bottom a it only apply the css to the bottom id, if you use div a it will apply css to all hyperlink in your webpage and it will mess everything up.

Answer 3

I dont know if I am understanding your problem all the way (i am visual learner), but it sounds like if you were to give it some padding, or a margin from the bottom it could work. in that case, you can try this:



#.id or class here {

margin: 3px 0px 3px 0px;

}

or



#.id or class here {

padding: 3px 0px 3px 0px;

}



the way the numbers work are TOP, RIGHT, DOWN, LEFT. so instead of writing:



padding-top: 1px;

padding-right: 2px;

padding-bottom: 3px

padding-left: 4px;



you could write:

padding: 1px 2px 3px 4px;



you can do this will all top,right,bottom,left scenarios. let me know if that works

Answer 4

align="top "valign="center"



I know what your trying to do and it's better to put them into an multi-cell table with these specific aliments in the tags. Apply a width to the table if you think you need one. Trying to move images and text around causes rendering issues on certain browsers so it's better to just use specific alignents in your classes even if it doesn't look exactly how you'd like.