 [css] div obok diva, Jak to zrobić? |
| [css] div obok diva, Jak to zrobić? |
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 6 Pomógł: 0 Dołączył: 24.05.2012 Ostrzeżenie: (0%) 
 |
Chciałbym umieścić diva obok diva. A dokładniej chodzi o to, by rightBox był obok content1. RightBox ma być po prawej, a content1 po lewej, walcze z tym już drugi dzień i nie mogę sobie poradzić, próbowałem już z ustawianiem display:inline;, float:left in w obu divach, z clear:both, ale bez skutku. Jeśli chodzi o divy to, div middle, jest po to żeby umieścić tło na całym środku, div gornaBelka i dolnaBelka sa po to, żeby umieścic belki z zaokrąglonymi rogami, div content1 grupuje gornabelke, content(tu jest zawartość właściwa) i dolnaBelke, div RightBox ma być boxem po prawej stronie od content1
Obecnie to wygląda tak http://postimage.org/image/6hnv6027t/ css code Kod @CHARSET "UTF-8"; body{ font: normal 100% Helvetica, Arial, sans-serif; background-color:#4F4F4F; color: #000; font-size: 12px; } img{ width:100%; } .page{ margin: 0 auto; max-width: 83em; background-image: url("../img/strona_tlo.jpg"); background-position: center; background-repeat: repeat-y; } .banner{ width:100%; background-image: url("../img/banner_tlo.jpg"); background-position:center; background-repeat:no-repeat; min-height:30px; height:130px; } .bannerText{ margin-left: 0.5em; padding-top: 3em; font-size: 2em; } .menu{ width:100%; font-size:1.25em; background-image:url("../img/menu_tlo.png"); background-position:center; background-repeat: repeat-y; } a{ margin: auto 0.5em; text-decoration: none; color: #000; } a:VISITED{ text-decoration: none; color: #000; } a:HOVER{ color: #555; text-decoration: underline; } .middle{ min-height:300px; min-width:300px; max-width: 83em; background-image: url("../img/tloPage.png"); background-position: center; background-repeat: repeat-y; } .content1{ width:85.5%; float:left; } .belkaGorna{ margin-top: 2em; margin-left:2em; height:25px; width:85.5%; background-image: url("../img/content1.png"); background-repeat: no-repeat; background-position: left; float:left; } .content{ margin-left: 2em; min-height:20em; float:left; width:85.5%; background-image: url("../img/content2.png"); background-position: left; background-repeat: repeat-y; } .contentHeader{ margin-left:1em; font-size: 1.5em; font-family: Georgia,serif; } .belkaDolna{ margin-left:2em; margin-bottom:2em; min-height:25px; float:left; width:85.5%; background-image: url("../img/content3.png"); background-position: left; background-repeat: no-repeat; } .rightBox{ float:right; min-height:10em; width:12.5%; background-image: url("../img/rb2.png"); background-repeat: repeat-y; background-position: center; } .rightBoxheader{ text-align: left; width:100%; background-image: url("../img/rb1.png"); background-repeat: no-repeat; background-position: center; } .rightBoxTitle{ font-size: 1.2em; margin: 0 0 0 10px; text-decoration: underline; } .footer{ clear:both; height:100px; width:100%; background-image:url("../img/stopka_tlo.png"); background-position: center; background-repeat: no-repeat; } .footerText{ text-align:center; margin: 0 auto; font-size: 0.9em; height:6em; line-height: 4em; vertical-align: middle; font-weight: normal; color:#111; } html code: Kod <body> <div class="page"> <jsp:include page="/template/banner.jsp" /> <c:import url="/MenuServ" /> <div class="middle"> <div class="content1"> <div class="belkaGorna"></div> <div class="content"> <decorator:body /> </div> <div class="belkaDolna" /> </div> <div class="rightBox" ></div> </div> <jsp:include page="/template/footer.jsp" /> </div> </body> Jakieś pomysły czemu to nie chce zadziałać(IMG:style_emoticons/default/questionmark.gif) (IMG:style_emoticons/default/snitch.gif) |
 |
 
|
 |
|
Post
#2
|
|
|
Grupa: Zarejestrowani Postów: 1 933 Pomógł: 460 Dołączył: 2.04.2010 Skąd: Lublin Ostrzeżenie: (0%)
|
Prawdopodobnie (bo nie chce mi się tego analizować wszystkiego, strasznie zagmatwane) jeden div nie mieści się obok drugiego, przeszkadzają mu marginesy, dlatego znajduje się nieco niżej. Ogólnie rzecz biorąc kontener je opakowujący jest zbyt wąski by je pomieścić obok siebie. Spróbuj nadać content1 width stałą np. 300px. Tak dla próby.
|
|
|
|
|
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 6 Pomógł: 0 Dołączył: 24.05.2012 Ostrzeżenie: (0%)
|
Cytat(b4rt3kk @ 4.10.2012, 22:22:23 )  Prawdopodobnie (bo nie chce mi się tego analizować wszystkiego, strasznie zagmatwane) jeden div nie mieści się obok drugiego, przeszkadzają mu marginesy, dlatego znajduje się nieco niżej. Ogólnie rzecz biorąc kontener je opakowujący jest zbyt wąski by je pomieścić obok siebie. Spróbuj nadać content1 width stałą np. 300px. Tak dla próby. Próbowałem tego wcześniej, po zmianie szerokości content1, wszystko zostaje zmniejszone (wtedy trochę widać, że ten rightBox się nie mieści), tylko dziwi mnie fakt, że po zmianie z szerokosci w procentach na szerokość w pikselach, zmianie ulega też rightBox, który nie należy do tego diva. |
|
|
|
Stjudent [css] div obok diva 4.10.2012, 21:15:03 
b4rt3kk Wszystko rozbija się o złe dopasowanie, jeden div ... 4.10.2012, 23:13:47 
Stjudent Cytat(b4rt3kk @ 5.10.2012, 00:13:47 )... 4.10.2012, 23:21:39 szalek01 [PHP] pobierz, plaintext <div class="belka... 4.10.2012, 23:18:55 szalek01 Wystaw tego html + css gdzieś na sieć, tak by każd... 4.10.2012, 23:47:27 Stjudent Cytat(szalek01 @ 5.10.2012, 00:47:27 ... 5.10.2012, 11:25:58 Shido Powyciągaj tylko z niego tego HTMLa, CSSa i obrazk... 5.10.2012, 13:54:00 Stjudent Zrobilem tak jak radziles, w sumie nie pomyślałem ... 5.10.2012, 15:30:05  |
|
Aktualny czas: 11.10.2025 - 00:45 |
