[div] ramka z zaokragleniami

Dmn · 16 Sierpnia 2006

Czy robil ktos kiedys ramke z zaokragleniami w divach? Jakos nie moge sobie poradzic... albo firefox albo ie zle ja wyswietlaja. Oto moje wypociny: www.damian.boo.pl/ramka/middle.htm Czy ktos moze wie jak sie z tym uporac?

kava · 16 Sierpnia 2006

https://www.neuroticweb.com/recursos/css-ro...d-box/index.php

Dmn · 16 Sierpnia 2006

hm... dzieki za odp. ale nie dokladnie o to mi chodzilo. Probowalem to przeksztalcic ale nic z tego nadal nie mam pomyslu... Ja potrzebuje ramki: kreski, a tutaj jest cale wypelnienie...

zerocool · 17 Sierpnia 2006

Ja potrzebuje ramki: kreski, a tutaj jest cale wypelnienie

to zrób sobie border dookoła

Dmn · 17 Sierpnia 2006

to zrób sobie border dookoła

Jak to by bylo tak proste to bym o to nie pytal. Jak dodam border to ramka kwadratowa jest na zewnatrz a w srodku widac pliki z zaokragleniami... LOGICZNE !

Mick · 17 Sierpnia 2006

Polecam znakomity art o okrągłych rogach

https://art.webesteem.pl/16/wstd_rounded_corners.php

zerocool · 17 Sierpnia 2006

a w srodku widac pliki z zaokragleniami... LOGICZNE

wiesz grafika a właciwie jej rogi (które de facto masz teraz gotowe ale wypełnione), również muszą mieć border :jezyk1: ale tak czy inaczej konktynuując, albo ja jestem jakiś magik, albo ty pokemon, bo jak widzisz u mnie się to udało zrobić prościej i za pomocą BORDER-a

więc podam przykład żebyś mógł to zobaczyć na własne oczy i jednocześnie dostaniesz gotowca.

PRZYKŁAD : RAMKA Z ZAOKRĄGLENIAMI BORDER CSS

edit : ja rozumiem że najlepiej byłoby żeby ktoś to zrobił za Ciebie, ale cytując Hellza z forum

Pozycjonowanie, PHP, MySQL, XHTML i CSS nie są dla każdego, serio!

yavaho · 17 Sierpnia 2006

Te przykłady mają sens jeżeli nie znamy szerokości diva (lub jest on pływający) Ale jeżeli ustawimy w stylach szerokość na stałe to chyba prościej zrobić jeden obazek - góra i drugi - dół i w ostateczności powtarzalny w pionie środek. I tyle, po co te kombinacje?

Istnieje jeszcze takie rozwiązanie:

<fieldset>
<legend>Title</legend>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</fieldset>

ale zaokrąglenia występują tylko w IE

17 Sierpnia 2006

Istnieje jeszcze takie rozwiązanie:
<fieldset>
<legend>Title</legend>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</fieldset>
ale zaokrąglenia występują tylko w IE

jest to bledne, niepoprawne, niesemantyczne rozwiazanie. fieldset sluzy do grupowania pol formularza - do niczego wiecej! chyba, ze wyrzucimy slowo optymalizacja z logo forum - wtedy nie ma sprawy ; /

yavaho · 17 Sierpnia 2006

Może jest niesemantyczne ale nie jest błędne. Ale ja i tak tego nie używam, bo inaczej wygląda w różnych przeglądarkach.

No to może coś w stylu tego wątka (zrobione w 10 min - nie testowane)

Trzeba tylko wstawić w stylach obrazki jako tło po rogach.

<html>
<head>
<style>
.blok{border:1px solid #dddddd;}
.blok p{margin: 10px 20px;}
.top_L{float:left; background:#dddddd; width:20px; height:20px;}
.top_R{float:right; background:#dddddd; width:20px; height:20px;}
.bottom_L{float:left; background:#dddddd; width:20px; height:20px; margin-top:-20px;}
.bottom_R{float:right; background:#dddddd; width:20px; height:20px; margin-top:-20px;}
</style>
</head>
<body>
<div class="blok">
<div class="top_L"></div><div class="top_R"></div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ornare ultricies libero. Donec fringilla, eros at dapibus fermentum, tellus tellus auctor erat, vitae porta magna libero sed libero.</p>
<div class="bottom_L"></div><div class="bottom_R"></div>
</div>
</body>
</html>

mkr · 18 Sierpnia 2006

https://www.boostdirectory.net/rogi.php - Mały przykład.

Wymagania:

1x Div

1x H1-H5

1x Grafika

zerocool · 18 Sierpnia 2006

No i kupka

rozjedzie się przy większej ilości tekstu

mkr · 18 Sierpnia 2006

Potrzebujemy grafikę tego typu.
Dostosowujemy ją do wymiarów jakie może mieć maksymalnie box.

Grafiki używam jako menu. Dla ograniczenia rozmiaru zmniejszyłem ją do rozmiaru, jaki maksymalnie może osiągnąć ten element mojej strony. Większa grafika ma większe możliwości skalowania. To jest jeden z przykładów. Można to zrobić na kilka sposobów.

PS. grafiki nie widać u Ciebie ale domyślam się jak to wygląda ( blokada hotlink )

zerocool · 18 Sierpnia 2006

Heh no i musiałem zakosić tą grafikę żeby było widoczne

Generalnie pomysł jest skuteczny w przypadku, jeżeli robisz boksy o ograniczonej ilości tekstu, jeśli myślimy o funkcjonalności to niestety odpada. Nawiększą funkcjonalność zapewni jednak skalowana ramka.

Dmn · 18 Sierpnia 2006

a w srodku widac pliki z zaokragleniami... LOGICZNE

wiesz grafika a właciwie jej rogi (które de facto masz teraz gotowe ale wypełnione), również muszą mieć border ale tak czy inaczej konktynuując, albo ja jestem jakiś magik, albo ty pokemon, bo jak widzisz u mnie się to udało zrobić prościej i za pomocą BORDER-a

więc podam przykład żebyś mógł to zobaczyć na własne oczy i jednocześnie dostaniesz gotowca.

PRZYKŁAD : RAMKA Z ZAOKRĄGLENIAMI BORDER CSS

edit : ja rozumiem że najlepiej byłoby żeby ktoś to zrobił za Ciebie, ale cytując Hellza z forum

Pozycjonowanie, PHP, MySQL, XHTML i CSS nie są dla każdego, serio!

Dzieki... nie wpadlem na to zeby dac obrazki na gorze i dole. caly czas staralem sie dodac border. Ale mam jeszcze takie pytanie. Czemu dodanie linijki na gorze (<?xml version="1.0" encoding="iso-8859-2"?>) powoduje ze IE blednie czyta strone? (obrazki sie rozjezdzaja)

Zaloguj się

[div] ramka z zaokragleniami

Rekomendowane odpowiedzi

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Gość w3master

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Odnośnik do komentarza

Udostępnij na innych stronach

Zarchiwizowany

Ostatnio przeglądający 0 użytkowników

Polecamy

Współpracują z nami

Powiadomienie o plikach cookie