재삐신생의 권태로운 이야기

일반적인 UL LI 리스트를 가로정렬시키려할때LI에 css로 display:inline-block스타일을 적용하였을때 발생한다. LI내부에 박스DIV를 만들면 쉽게 알 수 있다. example 하나 둘 셋 하나둘셋 해결책은 여러가지가 있으나, 근본적인 문제는li와 li 사이에 존재하는 줄바꿈 및 공백이 문제를 야기한다. 고로, 저 공백을 제거한다면 문제는 해결이 가능하다. 하나둘셋 하나둘셋 암튼, 알수 없는 공백으로 당황하지말고, 여백을 제거하면 끝!

일반적으로 팝업 차단이 팝업을 차단하는 방법은사용자의 동의없이 팝업을 띄우는(무분별한 팝업)을 막아주는기능이라, window.open으로 뜨는것들이 대부분이다.하지만, 호출의 주체가 사용자의 액션에 의한 것이면, 그것은 보통 문제없이 팝업을 띄워준다. 하지만 약간 애매한 부분이 있다.form을 새창으로 submit하는 경우다. 사용자의 액션이 없이도, 이 로직은 팝업차단을 회피하는 가장 편한 방법이다.하지만, 브라우져에 따라서, 이것을 막는 경우도 있고, 아닌 경우도 있다. 일례로 안드로이도 네이티브(기본) 브라우저는 form.submit()을 사용해서 팝업을 띄울수 있지만네이버앱은 그렇지가 않다. 팝업이 차단되었다는 메세지도 보이지 않는다. 지금 약간 황당한데, 네이버앱을 일반 인터넷으로 사용하는 사람..

방법 1 : a태그팝업 팝업 : 새탭으로 띄워짐 방법 2 : a태그+window.open팝업 팝업 : 방법1과 동일 방법 3 : form을 submit팝업 팝업 : 파라미터에 따른 url변화 외 특이상항은 없음

ul li를 한줄로 만들기위해 float:left를 자주 사용했는데 이제 웹환경이 많이 좋아졌으니inline-block를 막 사용할 수 있다. 물론 약간의 hack*zoom:1;*display: inline; 따위는 적용 float:left인 li요소를 가진 부모 ul을 inline-block해도 가운데 정렬효과를 얻을 수 있으며그냥 li요소에 inline-block를 해도 가운데 정렬효과를 얻을 수 있다. item1 item1 그냥 두가지 방법이 있다

웹사이트 개발시모바일은 염두 안 할 수가 없다!! 그런데 viewport라는걸 지정하지 않으면!! 모바일 브라우져는 확대/축소는 있지만 브라우져 윈도우 width값이 없기에 레이아웃을 깨지는 현상을 볼 수 있다. 필자는 width값이 980px로 고정되는 기이한 현상을 경험했는데 이는 모바일 브라우져의 default value viewport가 980px이란다. 적어도 모바일 크롬은 말이다. viewport를 지정하면 모든 문제는 해결된다. 이런식으로 지정을 할 텐데모바일용 웹이 아닌 상태로 모바일에서 잘보이게 하려면device-width말고, 직접 컨테이너 최대사이즈를 잘 지정하는것을 권장한다!! 980 width issue는 이것으로 해결!

childs요소가 float속성이 있으면parent요소의 (물론table-cell) vertical-align이 적용 childs요소가 일반 inline요소이면 요소의 vertical-align이 적용 vertical-align은 default로 상속 안됨 뭐, 둘다 vertical-align을 먹이는 경우가 많으니까, 중요한 issue는 아님! w3스쿨보다는 MDN이 더 정확함. refer : https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align

http://responsinator.com/ http://responsive.is/ http://troy.labs.daum.net/

.style0{mso-number-format:General;text-align:general;vertical-align:middle;white-space:nowrap;mso-rotate:0;mso-background-source:auto;mso-pattern:auto;color:black;font-size:11.0pt;font-weight:400;font-style:normal;text-decoration:none;font-family:"맑은 고딕", monospace;mso-font-charset:129;border:none;mso-protection:locked visible;mso-style-name:표준;mso-style-id:0;}.number{mso-number-format:"@";}.mon..

바햐흐로 2014년이 코앞이다. 웹페이지를 마크업하다보면 많은 착오가 생기기 마련 대부분 크로스 브라우징이 문제일 터 그래서 한번 포스팅을 시작한다. 레이아웃 구성 방법론에 대해 생각해본다. 1. table 코딩 고전의 전형적인 사이트를 표방하는 이방식은 table wrapper와 table container와 align속성으로 레이아웃을 구성하는데 엄밀히, 표를 표시하는 html요소 개념이라 w3c의 웹표준에는 어긋나는 잘못된 웹의 형태이다. ::장점:: 브라우져 호환성이 좋다. 정형화된 틀로 나이지긋한 분들은 오히려 선호하는 경우도 있다. 세로정렬(vertical align)이 매우 편하다/이것이 핵심일지도 모른다. ::단점:: 레이아웃이 틀에 박혀버린다. 예를 들어 마크업을 수정하지 않으면, 절대로..

메소드 디폴트 매개변수 혹은 함수 변수 기본값 혹은 method default parameter쓸 수 있는 표현이 많아서 제목이 헷갈리지만, 내용은 같다.대부분은 언어는 함수를 작성할때, 매개변수에 대한 기능이 존재한다.예를 들어int function METHOD(param1='기본값1',param2='기본값2'){return 1234;} 식으로 지정하면 METHOD(); 로 호출시, 매개변수는 기본값으로 적용되서 실행되는 식이다. 하지만, 멍청한 자바스크립트는 그런기능이 존재 하지 않는다.그래서 따로 체크 혹은 기본값 지정을 해야한다. function plus(num){return num+=1;}이와 같은 메소드가 있다면,plus(); 로 호출을 시도하면 num은 undefined이므로 정상작동이 안 ..