Jump to content

Default Property Values For Html Tags


skaterdav85
 Share

Recommended Posts

Does anyone know what the default property values are for the image tag, if not equal to 0 for some of the browsers? Im noticing image gaps in some of my pages where i put a cup-up mock up images in several div tags.Also, is there any site that tells you what the different default css property values are for all the html tags for the main browsers (FF, IE, Safari)?

Link to comment
Share on other sites

You probably are referring to a little separation that appears between images vertically. You can remove it by applying "vertical-align: middle" to the CSS of the image.

Link to comment
Share on other sites

You probably are referring to a little separation that appears between images vertically. You can remove it by applying "vertical-align: middle" to the CSS of the image.
ok thanks...so what exactly is going on here? I have 2 divs side by side, both with images, and there is this small gap in between them even though i set the margin and padding to 0 on both the divs and images.
Link to comment
Share on other sites

ok thanks...so what exactly is going on here? I have 2 divs side by side, both with images, and there is this small gap in between them even though i set the margin and padding to 0 on both the divs and images.
Can you show the HTML and CSS that is relevant to the problem?
Link to comment
Share on other sites

Can you show the HTML and CSS that is relevant to the problem?
<style type="text/css">body {	background-color:#333;}#main {	margin:10px auto;	width:720px;	background-color:#FFF;}div {	margin:0;	border:0;}#left {	width:61px;	height:540px;	border:2px solid yellow;	background-color:#F00;	display:inline;	vertical-align:middle;}#divider {		height:540px;	width:16px;	display:inline;	border: 2px solid yellow;	display:inline;	vertical-align:middle;}</style></head><body><div id="left"><img src="site_images/left_sidebar.jpg" width="61" height="540" /></div><div id="divider"><img src="site_images/divider.jpg" width="16" height="540" /></div></body></html>

Picture%201.pngsee how there is gap between those 2 divs that hold images...whats going on????

Link to comment
Share on other sites

<div id="left"><img src="site_images/left_sidebar.jpg" width="61" height="540" /></div><div id="divider"><img src="site_images/divider.jpg" width="16" height="540" /></div>

There are two lines of code there: that means that they're separated by a line break. If there was no line break all the code would be on one line.The line break reflects as a space between inline elements when parsed as HTML.

Link to comment
Share on other sites

<div id="left"><img src="site_images/left_sidebar.jpg" width="61" height="540" /></div><div id="divider"><img src="site_images/divider.jpg" width="16" height="540" /></div>

There are two lines of code there: that means that they're separated by a line break. If there was no line break all the code would be on one line.The line break reflects as a space between inline elements when parsed as HTML.

oh ok. i didnt know that. so if i just put this all on one line of code, there would be no space and it be fine?
Link to comment
Share on other sites

oh ok. i didnt know that. so if i just put this all on one line of code, there would be no space and it be fine?
Instead of asking you could try it yourself and get the answer. To answer your question: yes, unless there's something else interfering.
Link to comment
Share on other sites

Instead of asking you could try it yourself and get the answer. To answer your question: yes, unless there's something else interfering.
well i changed my code completely, so i was curious about the old way i had it...I just changed it just by floating each div element to the right and recreating the mockup from the most right images to the left. That seemed to work better. This was the first time i sliced up a mockup site into several images and put them into a table-less layout.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...