Jump to content

CSs reading


Raul
 Share

Recommended Posts

Hi , im just trying to put 3 text in a row but i dont know why css dont read my second text , i dont get it..  i cant put 2 position absolute in a position relative div?

.text1 {				  
  position: absolute;				  
  width: 20%;				  
  overflow: hidden;				  
  height: 300px;				  
  line-height: 30px;				  
  margin-left: 20px;				  
  margin-top: 100px;
}				
.text2 {				  
  position: absolute;				  
  width: 20%;				  
  overflow: hidden;				  
  height: 300px;				  
  line-height: 30px;				  
  margin-left: 20px;				  
  margin-top: 100px;
}	
	

The div classes are the same , copy paste , but the second one css dont read it idk what i do wrong

Edited by Raul
Link to comment
Share on other sites

So what you are saying is use bootstrap framework, for such a basic layout!? Really

The answer why it does not work is quite simple , you are using position: absolute;

You only use position: absolute; for overlapping elements.

Position: absolute is taken out of the flow from other elements and it does not adjust to content, it requires at the very least properties of left: and top: else they will overlap each other and maybe height and width. To other elements these position: absolute elements do not exit to take up any room, so they fill the area they would have occupied.

Just use block element like div, with percentage width of 33.33%, and float them left, thats it! The other option is to use display: flex;  which would be same layout. I think you will tutorial giving example for this kind of layout in both.

 

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...