html - Do block elements ignore floating elements? -

-

w3c states that:

since float not in flow, non-positioned block boxes created before , after float box flow vertically if float did not exist. however, current , subsequent line boxes created next float shortened necessary make room margin box of float.

this work expected divs:

#a  {  	width: 100px;  	height: 100px;  	background-color: blue;  	float: left;  }    #b  {  	width: 200px;  	height: 200px;  	display: block;  	border: 1px solid black;  	background-color: red;  }
<body>  	<div id=a></div>  	  	<div id=b></div>  </body>
here red div block-level element, therefore it's ignoring floating one. (if changed red 1 display: inline-block appear next floating one)

but, if apply display: block image ,it won't ignore floating div, why?

#a  {  	width: 100px;  	height: 100px;  	background-color: blue;  	float: left;  }    #b  {  	width: 200px;  	height: 200px;  	display: block;  	border: 1px solid black;  }
<body>  	<div id=a></div>  	  	<img id=b src="https://www.gravatar.com/avatar/5cb44dcd4ebddfea3ede8c6d46b02795?s=328&d=identicon&r=pg&f=1">  </body>

several paragraphs after 1 quote, spec says:

the border box of table, block-level replaced element, or element in normal flow establishes new block formatting context (such element 'overflow' other 'visible') must not overlap margin box of floats in same block formatting context element itself.

although you've applied display: block image, being image it's replaced element, , therefore float cannot intrude bounds.

only non-replaced block boxes don't establish block formatting contexts , in same flow float may ignore float.1 block-level replaced element not block box, because replaced element cannot block container box.2

1 you're thinking, that's ridiculously specific statement, , is. it's why terms "block element" considered extremely vague in css parlance. again, doesn't css defines equally vague terms "block box" refer boxes both block-level boxes , block container boxes.

2 this imply "non-replaced block box" of tautology, reinforces how ridiculously specific statement is.


Comments

Post a Comment

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

-
i trying work entity inside request method of spring boot application. entity in project , pom.xml has dependencies it. why error message?: org.hibernate.unknownentitytypeexception: unable locate persister: com.ric.bill.model.bs.par package com.ric.web; import java.util.concurrent.atomic.atomiclong; import javax.persistence.entitymanager; import javax.persistence.persistencecontext; import net.sf.ehcache.cachemanager; import net.sf.ehcache.management.cache; import net.sf.ehcache.management.cachestatistics; import org.hibernate.stat.statistics; import org.springframework.beans.factory.annotation.autowired; import org.springframework.boot.autoconfigure.domain.entityscan; import org.springframework.cache.annotation.enablecaching; import org.springframework.transaction.annotation.enabletransactionmanagement; import org.springframework.transaction.annotation.propagation; import org.springframework.transaction.annotation.transactional; import org.springframework.web.bind.annotati
Read more

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

-
i implementing go program uses bufio.scanner , bufio.writer have packaged code follows package main import ( "fmt" "player/command" "strings" ) func main() { //enter code here. read input stdin. print output stdout commands.scanner.scan() { //scan new line , send comand variable check command exist or not input := strings.split(strings.trim(commands.scanner.text(), " "), " ") command := input[0] if command == "" { fmt.printf("$ %s:", commands.pwd) continue } if !commands.commands[command] { commands.throwerror("cannot recognize input.") } else { commands.execute(command, input[1:], nil) } fmt.printf("$ %s:", commands.pwd) } } i using init.go file in main package follows package main import ( "flag" "player/sourc
Read more

c - double free or corruption (fasttop) -

-
this code reads null terminated string file (file containing null terminated strings & should provide index wanted string). error: *** error in `./main': double free or corruption (fasttop): 0x090a4a80 *** aborted code: char *tmp_realloc=null; char *sstring=null; int i=1; /*set file pointer point string*/ fseek(fh,index,seek_set); sstring=(char*)malloc(sizeof(char)); if(sstring == null) return null; tmp_realloc=sstring; while( (*(sstring+i-1)=(char)fgetc((file*)fh)) != 0x0 ) { /*reallocate more memory*/ tmp_realloc=(char*)realloc((char*)sstring,++i); /*if not same address copy old new & set old point new*/ if(tmp_realloc != sstring){ strcpy((char*)tmp_realloc,(char*)sstring); free(sstring); sstring=tmp_realloc; } } could tell me pointer causing issue (& reason) ? remove part /*if not same address copy old new & set old point new*/ if(tmp_realloc != sstring){ strc
Read more