универсален селектор *{margin: auto; padding: auto;}

Здравейте на всички. Интересувам се от уебдизайн, защото това за мен е много добра алтернатива. Видях курса по уеб дизайн и ме заинтригува и все още проявявам голям интерес.

Та да си дойда на думата: снощи имах възможността да изгледам две лекции за уебдизайн и втората беше много интересна за CSS основи. в нея се споменаваше за това как да се използва * и в каквави случаи само.

Често при правенето на по семпли страници използвам следното ето и самия css:

*{
margin: auto;
padding: auto;
}

body{
background-color: #333;

}

#main{
max-width: 960px;
min-width: 940px;
margin: 0 auto;
padding: auto;
}

#navbar{
width: 940px;
height: 40px;
background-image: url(images/navbar.png);
clear: both;
margin-top: 10px;
}

#menu {
float: left;
margin-left: -6px;
padding: 6px;
position: relative;
margin-top: -45px;
}

#contain{
margin-top: 10px;
clear: both;
width: 940px;
height: 850px;
background-image: url(images/contain.png);
position: relative;
}

#container{
width: 750px;
height: 650px;
background-color: #eee;
float: right;
margin-top: -750px;
margin-right: 15px;
z-index: 1;
position: relative;
}

#container p{
padding: 25px;
font: 14pt Arial oblique normal;
color: #333;
text-align: justify;
}

#footer{
margin-top: 10px;
clear: both;
width: 940px;
height: 40px;
background-image: url(images/footer.png);
position: relative;

}
a:link, a:visited{
color: purple;
text-decoration: none;
}

a:active, a:hover{
color: orange;
text-decoration: none;
}

за нарязването на шаблона или правенето на парчета от шаблона съм ползвал GIMP/Inkscape и за "кодирането" в HTML/CSS съм използвал Bluefish Editor. Ползвам Linux Ubuntu Studio

Надявам се, че това не е никакъв проблем, но искам да знам дали това, което съм написал е правилно, чел съм книги за HTML/CSS на издателство SitePoint:

jump start css, jump start html както и други подобни книги.

надявам се, че тук мога да намеря помощ от добронамерени специалисти. по принцип желая да си намеря и работа, но явно имам още много хляб да "ям". но с търпение и пстоянство всичко се постига.

бих желал да видите една моя лична страница, и да ми кажете/ да ме посъветвате как да я направя да "грабне" окото на клиента. тя е много семпла, а аз искам да наблегна върху семплия дизайн, който ще бъде удобен за потребителя. Благодаря Ви предварително.

P.S.:Ето личната ми семпла страница: http://jasper2020.ucoz.com/index.html, за навигация на бутоните съм ползвал adobe dreamweaver под windows xp, на виртуална машина virtualbox.

Като цяло всичко ми изглежда окей с изключение на няколко забележки. Първо ще ти препоръчам да не ползваш * за ресетване -> по-бавно работи ако просто селектираш всички елементи, които ползваш. Също така не мисля, че margin/padding: auto е добро решение. Когато се ресетват пропертитата просто им се дава по една 0 и после сам си подреждаш всичко както искаш. Към ресеторите може да добавяш и list-style-type: none ако ползваш списъци.

Второ. По-добре ползвай класове вместо id-та. В смисъл на това, че id се ползва предимно за JavaScript. Аз лично ползвам за момента само 1 id и то само на главния ми wrapper контейнер.

Последната ми забележка е към #container. Виждам, че му даваш -750px margin-top. Не знам къде по принцип в DOM дървото ти се намира този контейнер, но щом за да го позиционираш където искаш му задаваш толкова много, че и отрицателен margin значи явно не му е там мястото. Пробвай да го сложиш по-нагоре в кода си. По-принцип избягвай отрицателните margin-и и padding-и защото чупят концепцията за box модела (-5/-10px не е болка за умиране).

Страницата, към която си дал линк не я показжа -> 404 ;) Забелязах, че споменаваш Dreamweaver. Ами... ако го ползваш да ти пише кода, по добре си го напиши сам. Ако го ползваш за тестване на дизайни, няма проблем.

И последно... напъвай се здраво, има много материали за Web development из нета. Чети, гледай видеа, прави упражнения и в последствие ще усетиш как малко по малко ти се получават по-добре и по-добре нещата. И накрая не забравяй да вхърлиш едно око поне и на JavaScript, този жълт непослушник. Без него освен един готино изглеждащ статичен сайт няма как да направиш нещо повече.

Успех! ;)

Във форума е въведено ограничение, което позволява на потребителите единствено да разглеждат публикуваните въпроси.

универсален селектор *{margin: auto; padding: auto;}