Witam,
Zajmuje się aktualnie postawieniem sklepu na silniku Shoper'a, do tego został dorzucony styl RWD w cenie i problem polega na ustawieniu elementów headera(koszyk i wyszukiwarka). Strona nie jest czystym HTML'em, jest generowana w PHP'ie. Przejdźmy do rzeczy.
Pierwotnie header w stylu wyglądał tak:
Posiedziałem nad nim chwile, zmieniłem pod siebie i uzyskałem w rezultacie to:
Chciałem zmienić ułożenie by wyszukiwarka znajdowała się pod koszykiem i wszystko to przylegające do prawej strony portalu. Zacząłem kombinować po swojemu, czytaj. amatorszczyzna.
*podkreślenie to zmiany które dodałem.
header {
border-top: 5px solid @maincolor;
padding-top: 10px;
padding-bottom: 10px;
background: url('../images/logo_background.png') center center no-repeat;
position: relative;
opacity: 0.75;
position: relative;
.basket {
height: 44px;
line-height: 42px;
padding: 0 1em 0 1em;
background: url("../images/ico_arrow_down_small.png") no-repeat 96% 50% @colorWhite;
min-width: 220px;
opacity: 0.9;
position: absolute;
top: 4em;
right: 4em;
position: absolute;
top: 4em;
right: 4em;
.search-form {
margin-bottom: 10px;
position: absolute;
bottom: 0em;
right: 3em;
opacity: 0.9;
position: absolute;
bottom: 0em;
right: 3em;
Oczom moim ukazał się następujący widok(stanowisko w pracy, ekran 4:3):
Jednak w domu(ekran 16:9):
Podsumowując. Chciałbym aby koszyk i wyszukiwarka(jedno pod drugim) znajdowały się na krawędzi menu & slajdera, który znajdują się pod headerem. W tym miejscu proszę was o sprowadzenie mnie w dobrym kierunku, co powinienem zrobić by uzyskać efekt na jakim mi zależy, a był on jednolity na różnych rodzajach monitora.
Pozdrawiam,
Piotr